😎 Как и зачем искать UI-элементы в Console, DevTools?
Начнем с того, что к элементу в Console можно обращаться как к переменной. Достаточно кликнуть на этот элемент во вкладке Elements, после чего к нему можно будет обращаться вот так:
$0.— Какие полезные методы можно применять к
$0?🟠
$0 — отобразит элемент, выбранный во вкладке Elements;🟠
$0.innerText — выведет текст, содержащийся в этом элементе;🟠
$0.classList — покажет список CSS-классов, назначенных элементу;🟠
$0.id — вернет значение атрибута id элемента;🟠
$0.parentElement — вернет родительский элемент.— Как искать элементы?
🟠
$('.class_name') — отобразит элементы с указанным классом.Как указать несколько классов? Через точку вместо пробелов.
Например:
"example class name" → $('.example.class.name')🟠
$$('html_tag').filter(s => s.innerText.trim() === 'Text') — таким способом я ищу элементы по тексту.$$ в начале команды возвращает элементы в формате NodeList.🟠
$('span.class_name.class_name') — если нужно найти элемент по тегу и классам.👉Новости 👉База вопросов