
高效抓取动态网页html内容
很多网站内容并非初始加载时即完全呈现,而是由JavaScript动态生成。这时,简单的复制粘贴无法获取完整内容。本文将通过示例讲解如何完整获取动态生成的HTML。
假设网页包含以下代码:
<meta charset="utf-8">
<title></title>
<div id="test"></div>
<script>
const data = ["AAA", "BBB", "CCC"];
data.forEach((el) => {
$("#test").append(`<h1>${el}</h1>`);
});
</script>
<div id="test">的内容由JavaScript动态生成。直接查看网页源代码,只会看到一个空的div标签。要获取包含"AAA"、"BBB"、"CCC"三个标题的完整HTML结构,需要利用JavaScript的DOM操作。
<p>一个有效的方案是使用<code>document.documentElement.innerHTML。此属性返回整个HTML文档的源代码,包含动态生成的内容。 这样即可完整复制动态生成的HTML片段。 需要注意的是,此方法获取的是整个文档HTML,如需特定部分内容,需进一步处理。
立即学习“前端免费学习笔记(深入)”;










