jquery - 如何将 DOM 转储到变量中并将其从文档中分离（jQuery）

Question

我需要这样做：

var tempDoc;
$(tempDoc).load('<html>' + $(document).find('html').html() + '</html>');

然后这样做：

$('body', tempDoc).css('background-color', '');

但是，当我这样做时，背景色去除也会影响 $(document)。有没有办法将 $(document) 转储到临时变量中并更改其中的元素而不影响 $(document) 本身？

请让我知道这是否有意义。

score 0 · Accepted Answer

我认为我根本不明白这一点，但是您是否有理由不能这样做：

var tempDoc = $('html').clone();
$('body', tempDoc).css('background-color', 'green');

score 0 · Accepted Answer

使用 documentFragment 将 HTML 转储到，然后在不影响主文档的情况下更新属性，就像这样。

var fragment = document.createDocumentFragment();
fragment.append($(document).html());
$('body', fragment).css('background-color', '');

score 0 · Accepted Answer

只需使用.detach()。它正是为此而设计的。

但它会有相同的行为，因为不知何故（我不明白为什么）你在操纵同一个身体对象。

DocumentFragment 是一个很好的解决方案。另一种方法是使用.clone()复制您的身体，并操作该副本。

然后，您可以使用.replaceWith()将原始副本替换为修改后的副本。

var tempBody= $('body').clone(true);
tempBody.css('background-color', 'red');
$('body').replaceWith(tempBody);

3 回答 3