Ответ 1
С вкладкой HTML Firebug вы можете щелкнуть правой кнопкой мыши элемент <html>
и нажать "Копировать HTML".
Вы можете сделать то же самое с инструментами разработчика в Chrome/Safari.
Учитывая веб-страницу, которая использует множество javascript для генерации своего HTML, как я могу получить окончательный вычисленный HTML, который анализируется браузером вместо исходного HTML? Другими словами, предположим, что на странице есть множество тегов, окружающих функции javascript, которые при вызове возвращают некоторый HTML. Когда я просматриваю источник страницы, я вижу вызов функции script, а не HTML, который он создает.
Как я могу получить весь HTML-код, созданный на веб-странице?
Я заметил, что Firebug кажется способным видеть HTML вместо скриптов, но он, похоже, не имеет никакого способа сохранить всю страницу, только небольшие его сегменты.
Update:
Спасибо за все ответы. Тем не менее, я все еще не получаю HTML-код, который я вижу в консоли Firebug, с помощью любого из этих методов. На моей странице с примерами я использую вкладку "Информация" в своем собственном профиле Facebook. Если вы просмотрите источник на этой странице, вы увидите множество сценариев с названием "big_pipe.onPageletArrive()". Однако, если вы посмотрите на него в Firebug, каждый из этих вызовов функций отображает HTML. Я попробовал щелкнуть правой кнопкой мыши тег в Firebug, View Generated Source на панели инструментов Webdev и предложение Chrome, но все они дают мне вызов script, а не HTML.
Любые другие идеи?
Обновление 2:
Когда я сказал, что каждая из этих функций отображает HTML в Firebug, я был не совсем прав. Они отображаются только в том случае, если я выберу их на странице и щелкните правой кнопкой мыши- > Проверить элемент. Затем, как представляется, это сделать. Так что, может быть, мой вопрос стал тем, как вы получаете Firebug, чтобы автоматически отображать весь HTML-код, чтобы вы могли его выбрать и сохранить? (Или я открыт для любого другого решения для захвата этого HTML).
С вкладкой HTML Firebug вы можете щелкнуть правой кнопкой мыши элемент <html>
и нажать "Копировать HTML".
Вы можете сделать то же самое с инструментами разработчика в Chrome/Safari.
Панель инструментов веб-разработчиков для Firefox имеет параметр "Просмотр сгенерированного источника", который предоставляет эту функциональность.
with (window.open("")) {
document.open("text/html");
document.write("<!--\n"); //for live version delete this line
document.write(opener.document.documentElement.outerHTML.replace(/</g,"<").replace(/>/g, ">"));
document.write("\n//-->"); //for live version delete this line
document.close();
document.title = "DOM Snapshot:" + opener.document.title;
focus();
}
Если вы хотите живую версию, на которую можно кликать, просто пропустите теги комментариев в приведенном выше коде.
document.getElementById('awesomeness').textContent = document.documentElement.outerHTML.replace(/<\/\w+>/g, (e) => e + '\r\n');
<div id="awesomeness" style="overflow:scroll;width:100%;height:100%;white-space:pre;"/>
Это невозможно вообще. Вот отрывок из моего букмарклета, который опирается на нестандартный outerHTML
:
with (window.open("")) {
document.open("text/html");
document.write("<PRE>");
document.write(opener.document.documentElement.outerHTML.replace(/</g,"<").replace(/>/g, ">"));
document.write("</PRE>");
document.close();
document.title = "DOM Snapshot:" + opener.document.title;
focus();
}
Примечание. DTD отсутствует и вообще не восстанавливается.