如何在Chrome扩展程序中获取实际的HTML元素,而不是原始源代码

时间:2017-07-04 14:24:11

标签: javascript html google-chrome google-chrome-extension

我正在制作Chrome扩展程序,

在Chrome的Inspect Elements面板中,底部将显示HTML页面的所有元素。

如何在JavaScript中获取所有这些元素?

页面的原始源代码不包含所有元素。

如何在Chrome扩展程序中获取Inspect Elements中显示的所有元素?

请参阅以下图片:this one is the elements I wantthis one is the original source code

2 个答案:

答案 0 :(得分:1)

我只是使用JavaScript document.getElementsByTagName("html")[0],我得到了我想要的一切。

我不知道为什么我昨天没有得到正确的结果。

答案 1 :(得分:0)

您在JavaScript检查器中看到但不在HTML源代码中看到的任何元素都是(a)由浏览器自动添加以规范化任何缺少的元素(即没有<body>标记)或更正无效结构(即未封闭的<p>标签)使文件有效,或(b)通过JavaScript添加。

您用于从Chrome扩展程序检查文档的任何技术都会自动查看文档检查器中显示的文档。您无需执行任何特定操作。浏览器或JavaScript创建的所有元素都将存在。例如,您可以使用document.querySelectorAll('*')来获取包含所有这些对象的类数组对象,或使用document.body.outerHTML来获取HTML代码。

如果您想获得原始的,未经修正的源代码,那么实际上就更难了。