JavaScript:
Разбор HTML

Как это сделать:

Давайте разберем HTML с помощью API DOMParser в JavaScript.

const parser = new DOMParser();
const htmlString = `<p>Привет, мир!</p>`;
const doc = parser.parseFromString(htmlString, 'text/html');
console.log(doc.body.textContent); // Вывод: Привет, мир!

Теперь давайте получим что-то более конкретное, например, элемент с классом:

const htmlString = `<div><p class="greeting">Привет, снова!</p></div>`;
const doc = parser.parseFromString(htmlString, 'text/html');
const greeting = doc.querySelector('.greeting').textContent;
console.log(greeting); // Вывод: Привет, снова!

Подробнее

Парсинг HTML существует столько же, сколько и сам веб. Изначально это была задача браузеров — они разбирали HTML, чтобы отображать веб-страницы. Со временем программисты захотели вмешаться в этот процесс, что привело к появлению API вроде DOMParser.

Альтернативы? Конечно. У нас есть библиотеки вроде jQuery и инструменты вроде BeautifulSoup для Python. Но нативный DOMParser JavaScript быстр и встроен, не требуется дополнительных библиотек.

С точки зрения реализации, когда вы парсите HTML с DOMParser, он создает объект Document. Воспринимайте его как иерархическую модель вашего HTML. Как только у вас он есть, вы можете навигировать и манипулировать им так же, как и с обычным DOM веб-страницы.

Вот в чем дело — парсинг может споткнуться о неправильно сформированный HTML. Браузеры прощают ошибки, но DOMParser может быть не таким снисходительным. Поэтому для сложных задач или беспорядочного HTML сторонние библиотеки могут сделать лучшую очистку.

Смотрите также

  • Документация MDN по API DOMParser: MDN DOMParser
  • Возможности парсинга в jQuery: jQuery.parseHTML()
  • Cheerio, быстрая, гибкая и легковесная реализация основных функций jQuery для сервера: Cheerio.js
  • Для парсинга не на JS: библиотека BeautifulSoup для Python: Beautiful Soup