I can’t find the button with the querySelector

Asked

Viewed 164 times

0

Hi, I’m trying to find a button by Document.querySelector but I’m not getting it. I tried looking for it with the command:

document.querySelector("button.tabindex[class='btn btn-inverse btn-large pull-right']");

The command is wrong??

In the button element it says so:

<button tabindex="-1" class="btn btn-inverse btn-large"> Botao1 </button>
javascript classes selectors

3 answers

1


This here button.tabindex is looking for an element <button class='tabindex'>. Another point is that the element you are looking for has no class pull-right, soon the selector will not hit.

You can do the consultation like this:

const button = document.querySelector('button.btn.btn-inverse.btn-large[tabindex="-1"]')

console.log(`outer: ${button.outerHTML}`)
<button tabindex="-1" class="btn btn-inverse btn-large"> Botao1 </button>

  • I can use this: const button = Document.querySelector('button.btn.btn-inverse.btn-large[tabindex="-1"]') and then button.click(); ??

  • @lololololo in this case, querySelector will return a HTMLButtonElement, then yes.

  • I can trade the const for the var?

  • var, const or let? Which to use?

  • 1

    Okay, thank you very much <3

0

Yes, it is incorrect to access a property that is neither id nor class used [propriedade="valor"], same as for the classes. When using the selector .tabindex you are looking for an element with class tabindex

Correct:

button[tabindex][class='btn btn-inverse btn-large pull-right']

Or else:

button.btn.btn-inverse.btn-large.pull-right[tabindex]

  • would then be var botao = Document.querySelectorAll('button.btn.btn-inverse.btn-large[tabindex]'); ??

  • Yes, or using the other class selector

0

You could put an id on that button, besides being easier, it would be a much cleaner and more visible code

ex : <button tabindex="-1" class="btn btn-inverse btn-large" id= "idBOTAO" > Botao1 </button>

in the query call you would simply do 

const button = document.querySelector('#idBOTAO')

console.log(button)

I hope it helped ;)

  • with the id would be more complicated as I would have to put the ID all the time because I keep updating the page constantly

Browser other questions tagged javascript classes selectors

You are not signed in. Login or sign up in order to post.