Есть ли способ определить, активен ли класс CSS на странице HTML?

Question

это больше мое любопытство, я не знаю, возможно ли это. Если я на странице HTML, есть ли способ быстро определить, активен ли класс CSS на этой странице? Я объясню лучше, скажем, я нахожусь на веб-сайте со списком разных пользователей, и около их аватара у меня может быть зеленый значок для онлайн-пользователей, в то время как у других есть серый значок. Если этот список действительно длинный, есть ли способ программно (или, по крайней мере, быстрее, чем прокрутка и просмотр самостоятельно) определить, какие пользователи онлайн? Я думал, что у них другой активный класс CSS, но я не знаю, как его искать. Спасибо

ПРИМЕЧАНИЕ: я знаю, как обнаружить элемент, но если есть список элементов, мне нужно знать, какой из них имеет определенный активный класс

Answer 1

https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector

Размещение приведенного ниже кода в консоли разработчика должно отображать длину существующих имен классов, если они существуют.

const classes = document.querySelectorAll(".className");

console.log(className.length);

После этого вы сможете перемещаться по classes для соответствующей информации, перемещаясь по деревьям объектов, возвращаемых для каждого объекта, найденного методом querySelectorAll.

Но возможно, могут быть времена, когда это может не быть истинным счетчиком для набора данных. Например, если данные динамически загружаются при прокрутке страницы. Затем вы можете добавить итератор l oop, чтобы определить, когда достигли нижней части страницы, и pu sh в массив классов.

Answer 2

вы можете использовать (проверять) в chrome ctrl + shift + i. В элементе проверки вы можете увидеть, какая css активна или нет справа