Fatal编程技术网
  • javascript/
  • Chrome扩展-在JavaScript呈现之前获取真正的原始HTML文档

Chrome扩展-在JavaScript呈现之前获取真正的原始HTML文档

javascript google-chrome-extension

Chrome扩展-在JavaScript呈现之前获取真正的原始HTML文档,javascript,google-chrome-extension,Javascript,Google Chrome Extension,我正在使用一个内容脚本（加载了run\u at:document\u start），在从JavaScript进行任何DOM修改之前，尝试获取页面的确切的源代码 我想要纯HTML—这正是您从浏览器中的右键单击>查看源代码获得的内容 我试过两种方法，几乎都有效，但不完全有效 这是页面的实际原始源代码，从右键单击>查看源代码 <!doctype html> <html lang="en"> <head> <title>Raw HTML title

我正在使用一个内容脚本（加载了
run\u at:document\u start
），在从JavaScript进行任何DOM修改之前，尝试获取页面的确切的源代码

我想要纯HTML—这正是您从浏览器中的
右键单击>查看源代码
获得的内容

我试过两种方法，几乎都有效，但不完全有效

这是页面的实际原始源代码，从
右键单击>查看源代码


<!doctype html>
<html lang="en">
<head>
    <title>Raw HTML title</title>
</head>

<body>

<p>Something here.</p>

<script>
    document.title = 'Title injected by JS';
</script>

</body>

</html>



它缺少doctype，格式也与原件不符。
似乎无法获得视图源代码中显示的“纯”HTML。您可以获得的最接近的是


new XMLSerializer().serializeToString(document)


如果在
run\u at:document\u start
运行的内容脚本中触发上述操作（在DOM中存在任何内容之前），并监视DOM突变，则可以使用以下内容获取第一个突变：


var observer = new MutationObserver(function(mutations) {
    mutations.forEach(function(mutation) {
        var rawHTML = new XMLSerializer().serializeToString(document);
        console.log(rawHTML);
    });
});

var config = { attributes: true, childList: true, characterData: true }
observer.observe(target, config);



XMLSerializer（）
具有可靠的浏览器支持：
通过
文档
进行的重复访问很可能会让浏览器在呈现后解释HTML。内容脚本无法“在JavaScript对DOM进行任何修改之前”获得页面的确切来源因为当浏览器加载页面时，它还必须处理内联脚本，这些脚本可以修改页面，无论您是否需要。虽然您可以获得服务器响应，但您必须使用准确的URL和cookies发出单独的XHR/fetch请求。可能重复@wOxxOm
new XMLSerializer（）。serializeToString（文档）
和
document.documentElement.outerHTML
正是这样做的，但是请注意，在修改之前，标题标签是原始HTML标题。问题是格式不同，并且添加了一些附加属性

new XMLSerializer().serializeToString(document)



var observer = new MutationObserver(function(mutations) {
    mutations.forEach(function(mutation) {
        var rawHTML = new XMLSerializer().serializeToString(document);
        console.log(rawHTML);
    });
});

var config = { attributes: true, childList: true, characterData: true }
observer.observe(target, config);