Господа, пишу библиотеку по работе с DOM (для новых браузеров) и столкнулся с проблемой парсинга html. Конечная цель - сделать максимально компактно (< 1K). Это очередной мой опен соурц проект, о котором будет рассказано на Хабре и здесь.
К сожалению, я не могу найти простого решения парсинга HTML и представления его в виде DOM. Что первое приходит в голову? Создание элемента (дива) и вставка в него html.
div = document.createElement( 'div' );
div.innerHTML = '<p>a<p>b';
alert( div.innerHTML );
myDomNodes = div.children;
Проблема возникает, когда нам нужно распарсить элемент таблицы.
div = document.createElement( 'div' );
div.innerHTML = '<tr>a</tr><tr>b</tr>';
alert( div.innerHTML );
Понятно, почему так происходит: tr, td, tbody, thead, tfoot... не могут находиться внутри элементов, не являющихся их родителями по спецификации.
Другой вариант: использовать DOMParser
var doc = new DOMParser().parseFromString( '<tr>a</tr><tr>b</tr>', "text/html");
alert( doc.body.innerHTML );
Та же проблема.
Пробуем поменять контент-тайп на xml (потмо можно "усыновить" ноды методом document.adoptNode):
var doc = new DOMParser().parseFromString( '<tr>a</tr><tr>b</tr>', "application/xml");
console.log( doc );
Не ок. Метод будет парсить любой код выше (<tr>a</tr><tr>b</tr>, <p>a<p>b) с ошибками (не закрытый тег, который по стандарту html и не требуется закрывать, отсутствия рут элемента....)
Значит и этот метод нам не подходит.
А что по поводу DocumentFragment? Ничего. У него нет свойства innerHTML. Печаль.
Как это делается в библиотеках?
http://habrahabr.ru/post/164533/
Но предварительно jQuery пытается найти, не нужно ли обрамить наш код как-то дополнительно. Берется самый первый найденный в коде тег и ищется в служебном объекте wrapMap.
В Библиотеках это делается через, простите, жопу.
На дворе 2014 год и нет ни одного способа распарсить HTML в последнем хроме и файерфоксе? Не верю.