05/11/2015

Trigger click event on elements - Native JavaScript and JQuery.

Maybe I'm a Sysops guy, and don't use JavaScript on a daily basis, but JS became a mandatory language and got an elastic eco-system, so as a power user you may need it from time to time to do some fancy things :D

And one of those things is select or click on some elements in the webpage, for example multiple choice or expand list or so (e.g. some websites don't have expand all option). In fact, I learned basics of JS just to do things like that :D

Recently, with some help of a developer colleague, this was the final result with JQuery and native JS. JQuery has a function to do this, but if the website doesn't have use JQuery (which is rare nowadays) I use the native one.

I tested it on Firefox only, and all of this should be run in web browser console (Shift+Ctrl+K in Firefox Linux), and ".expand" is name of the element class we want to click it.

JQuery:
  $(".expand").click()
Native JavaScript:
var es = document.querySelectorAll('.expand')

for(var i=0; i < es.length; i++) {
  es[i].click()
}

I know it's not a big deal, but I frequently used it, so I think it's a good idea to post it.
Powered by Blogger.

Hello, my name is Ahmed AbouZaid and this is my "lite" technical blog!

I'm a passionate DevOps, Linux system administrator, RedHat Certified Engineer (RHCE), AWS SysOps/Solutions Architect, Free/Open source geek, author, interested in environment, calligraphy, and I believe that “Details Matter”!

Automation, data, and metrics are my preferred areas. I have a built-in monitoring chip, and too lazy to do anything manually :D

Popular Posts