У меня есть приложение, в котором я получаю строку HTML внутри элемента <template>
, с некоторыми смешанными пользовательскими шаблонными элементами. Затем я хочу проанализировать содержимое как элементы DOM.(Это ранее было сделано на стороне сервера.)
Ранее я пытался использовать DOMParser
для анализа шаблонов, но это не удалось, например, когда <tr>
было найдено в корне шаблона (поскольку строки требуютстол вокруг них).С <template>
все работало.
console.log(thisworks.outerHTML);
<template id="thisworks">
<tr><td><x:custom>Sample Text</x:custom></td></tr>
</template>
Однако, когда содержимое внутри <template>
не является структурно допустимым HTML (например, только <option>
/ <optgroup>
разрешено внутри <select>
),браузер пытается «исправить» структуру, ломая настраиваемые части шаблонов, а также некоторые другие вещи.
console.log(thisdoesnt.outerHTML);
<template id="thisdoesnt">
<table><x:custom><tr><td>Sample Text</td></tr></x:custom></table>
<select><x:custom><option>Sample Text</option></x:custom></select>
</template>
Я также не хочу просто использовать синтаксический анализатор XML, потому что источником может быть недопустимый XML, и его преобразование - большая работа с моимобъем существующего кода.
Есть ли способ (желательно без мегабайт зависимостей) для чистого анализа DOM в JavaScript, с синтаксисом HTML, но без ограничений HTML?