JavaScript:
Розбір HTML

Як:

Давайте спарсимо HTML використовуючи API DOMParser в JavaScript.

const parser = new DOMParser();
const htmlString = `<p>Hello, world!</p>`;
const doc = parser.parseFromString(htmlString, 'text/html');
console.log(doc.body.textContent); // Вивід: Hello, world!

Тепер давайте заберемо щось більш конкретне, як-от елемент з класом:

const htmlString = `<div><p class="greeting">Hello, again!</p></div>`;
const doc = parser.parseFromString(htmlString, 'text/html');
const greeting = doc.querySelector('.greeting').textContent;
console.log(greeting); // Вивід: Hello, again!

Поглиблено

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

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

З точки зору реалізації, коли ви парсите HTML з DOMParser, це створює об’єкт Document. Думайте про це як про ієрархічну модель вашого HTML. Як тільки ви її отримаєте, ви можете навігувати та маніпулювати нею так само, як і з DOM звичайної веб-сторінки.

Ось що—парсинг може заплутатися на некоректному HTML. Браузери прощають, але DOMParser може і не пробачити. Отже, для складних завдань або заплутаного HTML сторонні бібліотеки можуть зробити кращу роботу з очистки.

Дивіться також

• MDN Web Docs про API DOMParser: MDN DOMParser
• Відомості про парсинг в jQuery: jQuery.parseHTML()
• Cheerio, швидка, гнучка та лаконічна реалізація основи jQuery для сервера: Cheerio.js
• Для нон-JS парсингу: бібліотека BeautifulSoup Python: Beautiful Soup