可以在文档外的元素上使用 jQuery 吗？

Question

使用一些遗留架构，并且由于初始化序列的性质，我需要在将元素添加到文档之前对其进行包装。假设我有以下内容：

<div id="containerX">
   <div id="myNode"></div>
</div>

而且我需要在将“myNode”添加到 DOM 之前对其进行包装。 jQuery 选择器甚至可以在这种情况下工作吗？如果是这样，我怎样才能做到这一点？我试过像这样传递元素：

（更正了下面一些答案中提到的一些错别字）：

$(this.element).wrap('<div id="'+ "myWrapper_" + this.id + '"></div>');

没有运气。我假设选择器的常用语法不起作用，因为节点在文档之外。我发现的最接近的东西是这里的帖子：Manipulate DOM elements before adding them to the document，但我的情况和他的不同之处在于我没有字符串，我有使用 document.createElement 创建的元素尚未附加。

谁能指出我正确的方向，或者这是否可能？

谢谢

Answer 1

您也可以在其他元素上使用 Jquery，我不止一次使用它来解析来自 AJAX 请求的响应。

虽然我不确定您的确切要求是否可行，但我认为您的代码中的主要问题是您尝试环绕元素的 div 之前缺少 <。

Answer 2

jQuery 允许您处理尚未添加到文档中的元素。它们可以是简单的 HTML 字符串，也可以是使用 createElement() 构造的元素。

让我给你一个简单的例子：

var container=document.createElement('div');
container.id='containerX';
var mynode=document.createElement('div');
mynode.id='myNode';
container.appendChild(mynode);

$(container).find('#myNode').wrap('<div id="myWrapper'+mynode.id+'">');

这应该会产生您想要的结构。你只需要应用你的变量名。我这样做是因为我不确定您的 this.element 包含什么。

请查看jsFiddle Demo。

Answer 3

首先，您的代码中有错误。你错过了一个“+”。试试这个：

$(this.element).wrap('div id="' + myWrapper + this.id + '"></div>');

注意“myWrapper”之前的“+”。

但是我认为你是对的，你不能在 DOM 之外的元素上使用 wrap。您总是可以将它添加到 DOM，然后包装它。如果您不希望它在 DOM 中，则调用 remove 将其取回；当然，这意味着删除其父元素，而不是原始元素本身。我自己还没有尝试过所有这些，但它应该可以工作。您需要父级（包装器）有一个唯一的 id，这样您就可以确保抓住它。另一件事，看起来您希望父级具有与您要包装的元素相同的 id。您应该避免将相同的 id 分配给两个元素。因此，如果父级获取了 id，则应将其从元素中删除。