javascript - 如何将整个 HTML 文档作为不包括某些元素的字符串获取？

Question

我正在寻找一种方法来获取整个 HTML 文档，将一些项目(可能用名为“exclude”的类名标记)作为字符串排除在外。我知道我可以使用 document.documentElement.innerHTML 获取整个文档或 document.documentElement.outerHTML和 document.getElementsByTagName('html')[0].innerHTML

我仍在努力解决的问题是如何在获取 innerHTML 之前排除一些具有共同类名的节点(例如按钮或 div 或任何其他标签)？

Answer 1

我可能会克隆整棵树，然后删除不需要的元素:

var clone = document.body.cloneNode(true);
clone.querySelectorAll(".exclude").forEach(function(element) {
    element.parentNode.removeChild(element);
});
var html = clone.outerHTML;

请注意，这假设 body 本身没有 exclude 类。

例子:

var clone = document.body.cloneNode(true);
// Snippet-specific: Also remove the script
clone.querySelectorAll(".exclude, script").forEach(function(element) {
    element.parentNode.removeChild(element);
});
var html = clone.outerHTML;
console.log(html);

<div>
  I want this
  <div>And this</div>
</div>
<div class="exclude">
  I don't want this
  <div>Or this, since its parent is excluded</div>
</div>