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 engineer, Cloud/Kubernetes specialist, Free/Open source geek, and an author.

I believe in self CI/CD (Continuous Improvements/Development), also that "the whole is greater than the sum of its parts".

DevOps transformation, automation, data, and metrics are my preferred areas. And I like to help both businesses and people to grow.

Popular Posts

Blog Archive