Roy
Roy

Reputation: 17

Access button class in javascript

I have a button class that is placed inside an iframe. Problem is that this button's class has such a long name and I do not understand how to reference it in my script.

<button class="PDF-dmzpd5z6ckdkxkn8 PDF-5rbqp8nfgh6e11 PDF-tma5quj Toolbar-Button Tool-Button" title="SignUp" aria-label="myButton001" type="button"></button>

I am using my javascript to reference this class as:

document.querySelector("iframe").contentWindow.document.querySelector(".PDF-dmzpd5z6ckdkxkn8").click();

The above code does not work. Do I have to provide the complete class name for reference?

I am on right track because I have another button that looks like this:

<button class="PDF-tdsfethgr51stg Next-Button Next-Previous-Button" title="Next" aria-label="Next" type="button"></button>

And I can easily call/reference it via:

document.querySelector("iframe").contentWindow.document.querySelector(".PDF-tdsfethgr51stg").click();

Upvotes: 0

Views: 217

Answers (2)

Amrit Bera
Amrit Bera

Reputation: 166

Using Id in button is the best option

Example:

<button class="PDF-dmzpd5z6ckdkxkn8 PDF-5rbqp8nfgh6e11 PDF-tma5quj Toolbar-Button Tool-Button" title="SignUp" aria-label="myButton001" type="button" id="exbtn1"></button>
document.querySelector("iframe").contentWindow.document.querySelector("#exbtn1").click();

Note: It's best option to define the tags in Query Selector (eg. document.querySelector("iframe")[0]). The index starts from 0.

Upvotes: 0

Suleyman
Suleyman

Reputation: 262

If selecting with class doesn't work, you can try to select with title attribute:

document.querySelector('button[title="SignUp"]');

Upvotes: 3

Related Questions