Методы преобразования HTML в JSON в JavaScript

Чтобы сопоставить HTML с JSON в JavaScript, вы можете использовать несколько методов в зависимости от ваших конкретных требований. Вот несколько распространенных подходов:

  1. Использование библиотеки JavaScript. Существует несколько библиотек JavaScript, которые помогут вам преобразовать HTML в JSON. Одной из популярных библиотек является Cheerio, которая предоставляет API-интерфейс типа jQuery для анализа и управления HTML. Вы можете использовать Cheerio вместе с JSON.stringify для преобразования элементов HTML в объекты JSON.

Пример кода с использованием Cheerio:

const cheerio = require('cheerio');
const html = '<div><h1>Title</h1><p>Content</p></div>';
const $ = cheerio.load(html);
const jsonObj = {};
$('div').children().each((index, element) => {
  const tagName = $(element).prop('tagName');
  const text = $(element).text();
  jsonObj[tagName] = text;
});
const jsonString = JSON.stringify(jsonObj);
console.log(jsonString);
  1. Ручной анализ. Если вы предпочитаете не использовать библиотеку, вы можете вручную проанализировать HTML с помощью методов JavaScript DOM и построить структуру JSON.

Пример кода с использованием методов DOM:

const html = '<div><h1>Title</h1><p>Content</p></div>';
const parser = new DOMParser();
const doc = parser.parseFromString(html, 'text/html');
function parseElement(element) {
  const obj = {};
  obj.tagName = element.tagName.toLowerCase();
  obj.content = element.innerHTML.trim();
  if (element.children.length > 0) {
    obj.children = Array.from(element.children).map(parseElement);
  }
  return obj;
}
const jsonObj = parseElement(doc.body.firstChild);
const jsonString = JSON.stringify(jsonObj);
console.log(jsonString);
  1. Регулярные выражения. Хотя обычно не рекомендуется анализировать HTML с помощью регулярных выражений, в простых случаях вы можете использовать регулярное выражение для извлечения определенных данных из HTML и преобразования их в JSON.

Пример кода с использованием регулярных выражений:

const html = '<div><h1>Title</h1><p>Content</p></div>';
const regex = /<([a-z]+)(?:[^>]+)?>((?:.(?!<\1))*.?)<\/\1>/gi;
const jsonObj = {};
let match;
while ((match = regex.exec(html))) {
  const tagName = match[1];
  const content = match[2].trim();
  jsonObj[tagName] = content;
}
const jsonString = JSON.stringify(jsonObj);
console.log(jsonString);

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