как найти html элемент по содержимому текста в javascript

Аватар пользователя Ivan Mamtsev
Ivan Mamtsev
26 февраля 2025

Для того чтобы найти HTML элемент по содержимому текста в JavaScript, можно воспользоваться различными методами.

Использование метода document.querySelector()

Метод document.querySelector() позволяет выбрать первый элемент в документе, который соответствует определенному селектору CSS. Мы можем использовать этот метод, чтобы найти элемент по содержимому текста. Пример:

const element = document.querySelector('p:contains(""текст"")');

Здесь мы ищем <p> элемент, содержащий текст ""текст"". Однако стоит отметить, что в чистом JavaScript поддержки для :contains нет, и его нужно реализовать с помощью дополнительного кода.

Использование метода document.evaluate()

Метод document.evaluate() позволяет выполнять XPath запросы к DOM дереву. С его помощью можно найти HTML элементы по содержимому текста. Пример:

const xpath = `//*[contains(text(), 'текст')]`;
const result = document.evaluate(xpath, document, null, XPathResult.ANY_TYPE, null);
const element = result.iterateNext();

Здесь мы используем XPath запрос, чтобы найти любой элемент, содержащий текст ""текст"".

  • Оба метода могут быть использованы для поиска элементов с определенным текстовым содержимым.
  • Важно помнить, что поиск по тексту может быть неэффективным для больших документов из-за обхода всего DOM дерева.
  • Предпочтительнее использовать уникальные идентификаторы или классы элементов для более эффективного доступа к ним.
0 0
Познакомьтесь с основами JavaScript бесплатно