Получить текущий HTML-код страницы, созданной с помощью запросов AJAX

2313
Richard

Итак, я использую браузер Chrome / Chromium (на месте может использовать Firefox, если это будет необходимо).

Я просматриваю веб-страницы, которые созданы «на лету» с (предположительно) AJAX (подумайте, как вы прокручиваете страницу вниз на Facebook, и все просто появляется и появляется).

Я хотел бы сохранить html для такой страницы после того, как она загрузит кучу материала, но это не отображается в DOM Инструментов разработчика Chromium, и щелчок правой кнопкой мыши по Сохранить просто сохраняет исходную страницу до загрузки AJAX. вещи.

Что я могу сделать?

6
http://stackoverflow.com/questions/1750865/best-way-to-view-generated-source-of-webpage erikxiv 12 лет назад 0
Может быть странно Мой Chrome показывает загруженный ajax контент на локально сохраненной странице .html. iAnuj 11 лет назад 0

2 ответа на вопрос

2
rahuldottech

Один из способов получить исходный код со всеми динамически загружаемыми элементами - через Chrome Developer Tools ( F12). Выберите <HTML>тег в самом начале страницы и скопируйте элемент ( CTRL+ C). Это также должно скопировать все вложенные данные, динамически загруженные или иным образом, в буфер обмена, и затем вы можете вставить их куда угодно.

Вот рисунок, показывающий процесс:

Process

Очевидным недостатком является то, что вы будете иметь, чтобы вручную загружать любые файлы ( .js, .css, изображения) и сохранить их (подсказка: Используйте «источники» вкладки в Dev Tools) в той же папке, что и HTML - файл, если вы хотите полный веб-сайт или, в качестве альтернативы, измените ссылки в источнике HTML следующим образом, если вы не возражаете против получения некоторых данных из Интернета:

===ORIGINAL===  <img src="file.jpg">  ===MODIFIED===  <img src="[url_of_website_that_you_want_to_save]/file.jpg">
В Firefox команда «Копировать - Внутренний HTML» Richie Frame 6 лет назад 0
1
rahuldottech

Bookmarklet

Вот еще один метод, гораздо более простой!

Сохраните следующий код JavaScript в виде букмарклета и щелкните по нему на странице, для которой вы хотите просмотреть созданный источник:

javascript:(function(){ function htmlEscape(s) x=window.open(); x.document.write('<pre>' + htmlEscape('<html>\n' + document.documentElement.innerHTML + '\n</html>')); x.document.close(); })();

Нажмите здесь, чтобы сделать процесс проще! | JSFiddle

GIF: rahuldottech!

Похожие вопросы