How does one programmatically click a button via the browser console [code inside]

Question

For some reason, I am able to click some links/buttons, but cannot for buttons/anything that has an onclick attribute. For example: my JavaScript code I input into the browser's console:

var o = document.getElementsByName("takepic"); for (var i = 0; i < 1000; i++){ o.click(); console.log(i); }

I put console.log so I know what the browser is doing, and where it currently is at.

The html code on the page:

<form> <input type="button" value="Configure..." onclick="webcam.configure()"> &nbsp;&nbsp; <input type="button" value="Take Snapshot" onclick="take_snapshot()" name="takepic"> </form>

So basically, I want to take rapid snapshots using the browser console, but when I enter in my code, I get this error:

TypeError: Object # has no method 'click'

When I do use the same code, say for re-adding friends on facebook, and I use this:

var o = document.getElementsByName("fbaddfriend_example"); for (var i = 0; i < o.length; i++){ o[i].click(); console.log(i); }

It definitely works. I'm just trying to do the same with a button on a page, but with no avail.

Yup, but for some reason SOF puts them in separate lines [which is pretty cool]. — Jeromie Devera
– Jeromie Devera, Commented Feb 23, 2014 at 18:33
Some element types do have a click method, some don't. See duplicate of How to simulate mouse click using Javascript? — Bergi
– Bergi, Commented Feb 23, 2014 at 18:42

Bic · Accepted Answer · 2014-02-23 18:33:59Z

Your problem is in the code you're typing into the console. You are using document.getElementsByName(), which will return an array of elements. You need to loop through those elements. You are doing this in your second code segment, but not your first.

var o = document.getElementsByName("takepic"); for (var j = 0; j < o.length; j++) { for (var i = 0; i < 1000; i++){ o[j].click(); console.log(i); } }

ComFreek · Accepted Answer · 2014-02-23 18:33:50Z

5

Change the code to:

var o = document.getElementsByName("takepic"); for (var i = 0; i < 1000; i++){ // ---v o[i].click(); console.log(i); }

The variable o holds a collection of all retrieved elements. o[i] returns the element at position i.

answered Feb 23, 2014 at 18:33

ComFreek

29.5k18 gold badges107 silver badges157 bronze badges

4 Comments

Jeromie Devera Over a year ago

Nice, I should have tried adding that array of i to o. It works, but it clicks just once. It doesn't continue. an error spits out too: "TypeError: Cannot call method 'click' of undefined" EDIT: Oh, I think it's because i is being added 1 to it, and since there's only one element, i should just hardcode "1" in o[1].click() .... I'll try this out, and I'll get back to you

Bic Over a year ago

@JeromieDevera if there is only one element, give it an id, and then use document.getElementById(). Then you don't have to worry about referencing an array index. Also, arrays are zero-indexed. If there is only one, the index is 0.

ComFreek Over a year ago

@JeromieDevera The loop runs 1000 times, but the array o contains fewer elements. Consider Bic's code which clicks each button 1000 times.

Jeromie Devera Over a year ago

I added 0 since it was a 0 index (starts at 0) and it worked! Thanks for explaining further what the getElementsByName method really did. Really helped.

Collectives™ on Stack Overflow

How does one programmatically click a button via the browser console [code inside]

2 Answers 2

Comments

4 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Linked

Related