Разбор DOM в JavaScript
Немного предыстории:
Я занимаюсь разработкой мобильного веб-приложения с использованием JavaScript. HTML-рендеринг основан на Safari. Междоменная политика отключена, поэтому я могу звонить в другие домены, используя XmlHttpRequests. Идея состоит в том, чтобы разобрать внешний HTML и получить текстовое содержимое определенного элемента.
Раньше я построчно разбирал текст, находя нужную мне строку. Затем получите содержимое тега, который является подстрокой этой строки. Это очень хлопотно и требует много обслуживания каждый раз, когда изменяется целевой HTML.
Итак, теперь я хочу проанализировать HTML-текст в DOM и выполнить для него запросы CSS или XPath.
Это работает хорошо:
$('<div></div>').append(htmlBody).find('#theElementToFind').text()
Единственная проблема заключается в том, что когда я использую браузер для загрузки html-текста в элемент DOM, он пытается загрузить все внешние ресурсы (изображения, файлы js и т. Д.). Хотя это не вызывает никаких серьезных проблем, я бы хотел этого избежать.
Теперь вопрос:
Как я могу анализировать HTML-текст в DOM без загрузки браузером внешних ресурсов или запуска сценариев JS?
Некоторые идеи, о которых я думал:
- создание нового объекта документа с помощью вызова createDocument (
document.implementation.createDocument()), но я не уверен, что он пропустит загрузку внешних ресурсов. - использовать сторонний DOM-парсер в JS - единственный, который я пробовал, был очень плох с обработкой ошибок
- используйте iframe для создания нового документа, чтобы внешние ресурсы с относительным путем не выдавали ошибку в консоли
2 ответа
Кажется, что следующий кусок кода прекрасно работает:
var doc = document.implementation.createHTMLDocument("");
doc.documentElement.innerHTML = htmlBody;
var text = $(doc).find('#theElementToFind').text();
внешние ресурсы не загружены, сценарии не проверяются.
Нашел здесь: /questions/5421670/javascript-domparser-dostup-k-innerhtml-i-drugim-svojstvam/5421686#5421686
Происхождение: https://developer.mozilla.org/en/DOMParser
Вы можете создать объект jQuery из любой строки html, не добавляя его в DOM:
$(htmlBody).find('#theElementToFind').text();