javascript - 如何防止在 Chrome 中加载未附加元素的资源

Question

我正在开发 Chrome 扩展，但遇到以下问题:

var myDiv = document.createElement('div');
myDiv.innerHTML = '<img src="a.png">';

现在发生的是 Chrome 尝试加载“a.png”资源，即使我没有将“div”元素附加到文档。有什么办法可以预防吗？

_在扩展中，我需要从一个不提供任何 API 的站点获取数据，因此我必须解析整个 HTML 以获取必要的数据。编写我自己的简单 HTML 解析器可能很棘手，所以我宁愿使用 native HTML 解析器。然而，在 Chrome 中，当我将整个源代码放入某个临时的非附加元素(这样它会被解析并且我可以过滤必要的数据)时，图像(可能还有其他资源)也开始加载，导致更高流量或(在相对路径的情况下)控制台中的大量错误。 _

Answer 1

为了防止加载资源，您需要在一个全新的 #document 中创建您的节点 .您可以使用 document.implementation.createHTMLDocument为此。

var dom = document.implementation.createHTMLDocument(); // make new #document
// now use this to..
var myDiv = dom.createElement('div');  // ..create a <div>
myDiv.innerHTML = '<img src="a.png">'; // ..parse HTML