Pull to refresh

О скромном DOMParser замолвите слово

Данная статья посвящена одному из объектов Web API Interfaces, а именно — DOMParser.
Поиск на Хабре выдаёт 7 статей, где он упоминается лишь вскользь. Мне кажется, это требует исправления.

Коротко и по делу:

  • DOMParser предназначен для парсинга «сырой» строки HTML, XML, SVG в объект. Обратный парсинг также не составляет труда;
  • Для парсинга DOMParser располагает методом «parseFromString». Результатом работы данного метода является объект DOM, а если точнее – это либо объект HTMLDocument (в случае HTML), либо объект Document (в случае XML), либо SVGDocument (в случае SVG);
  • здесь написано что данный объект относится к экспериментальной части API. А вот здесь сказано какими браузерами и их версиями он поддерживается (если коротко – последние версии большой браузерной пятерки поддерживают);
  • далее будет идти речь только в контексте парсинга HTML
  • Наверное, вас интересует вопрос, а все ли сущности HTML попадают в итоговый объект при парсинге? Ответ — все, кроме тега <!doctype>. Согласитесь, это мелочь, в мире нет ничего идеального;
  • С полученным объектом можно «играться» как с любым другим DOM-объектом, легко можно внедриться в него с помощью того же jQuery, заменить там что-нибудь ненужное на что-нибудь нужное. После этого можно выполнить обратный парсинг (из объекта в строку). Тут не забываем про тег !doctype, он исчезнет (см. выше);
  • Что с «обломами»? Есть одна проблемка — если парсинг заканчивается неудачей то исключение не бросается, а возвращается «кривой» объект HTMLDocument. Данный баг имеет красивый номер 45566.

Теперь потренируемся на кошках?

var parser = new DOMParser();  //создаем объект DOMParser
//парсим
var doc = parser.parseFromString(html_text, "text/html");  //html_text - это текст который мы хотим распарсить. Второй аргумент, это MIME-тип, для XML он должен быть равен "application/xml", для SVG - "image/svg+xml") 
var jq = $('a', doc);  //получаем jQuery-коллекцию всех тегов "a"
jq.each(function(){ //заменяем в каждом и теге значение атрибута "href"
   $(this).attr("href", "new.html");
});
//и наконец делаем обратный парсинг
console.log("result="+doc.documentElement.outerHTML);

Засим разрешите откланяться, спасибо за внимание.

P.S. Надеюсь статья будет полезна, замечания приветствуются.
Tags:
Hubs:
You can’t comment this publication because its author is not yet a full member of the community. You will be able to contact the author only after he or she has been invited by someone in the community. Until then, author’s username will be hidden by an alias.