document.querySelector() 结合类名和属性

Question

How can I combine both class names and element attributes in a document.querySelector() call.

let's say my element is as below:

<div role="button" class="fj2rt Gdrwg"></div>

I want to pass both class names and attribute in the document.querySelector() call for example:

let btn = document.querySelector('.fj2rt.Gdrwg [role="button"]';

Answer 1

No space needed between the role name and class name.

So document.querySelector('.fj2rt.Gdrwg [role="button"]'; should be replaced with document.querySelector('.fj2rt.Gdrwg[role="button"]'; .

I have attached working example.

 let btn = document.querySelector('.fj2rt.Gdrwg[role="button"]'); console.log(btn);

 <div role="button" class="fj2rt Gdrwg"></div>