CODEWITHSUNDEEP
google-chromesearchgoogle-chrome-devtoolsdeveloper-tools
dayuloli
dayuloli

Reputation: 17021

Searching for HTML elements in Chrome DevTools

On this website, there's a div with the attribute class="item". When I clicked F12 to bring up the Developer Tools. I pressed Ctrl + F and typed in class="item" and no results came back. I also tried Ctrl + Shift + F but nothing returned. Here is a screenshot:

enter image description here

Even if I search for class=, only text within HTML comments are found.

Upvotes: 79

Views: 117811

Answers (6)

KulaGGin
KulaGGin

Reputation: 1233

Just use CSS selectors. Just .item would work here.

If you need some particular element with a specific class name, just do div.item.

Custom attributes work, too: a[aria-label="Test Text"].

Upvotes: 1

innomerphey
innomerphey

Reputation: 331

Search bar only supports string, CSS selectors or XPath selectors.

I recommend you use CSS selectors: [class="item"]

Upvotes: 10

dayuloli
dayuloli

Reputation: 17021

I searched for the XPath of the element instead and it worked:

//*[@class="item"]

Upvotes: 46

Amauri
Amauri

Reputation: 550

Late answer but pretty sure .item would've worked.

Upvotes: 19

Ben Crook
Ben Crook

Reputation: 647

Dayuloli's fix is a good one, you can also just search for "item" although that won't work if there are multiple classes on that element.

Upvotes: 0

jaredwilli
jaredwilli

Reputation: 12308

This seems like it might be a bug. You can report it on http://crbug.com.

If you were to search for 'item' you should be able to find the elements that have the class item on them.

Upvotes: 0

Related Questions