jQuery 换行语法

Question

一天结束了。我希望我只是逻辑错误。

我无法让这个工作：

var $divA= $("<div></div>").addClass('classA');

var $divB= $("<div></div>").addClass('classB');

$myDiv.after($divA.wrap($divB));

上面应该把这个：

<div id="myDiv"></div>

变成这个：

<div id="myDiv"></div>
<div class="classB">
    <div class="classA"></div>
</div>

但它似乎不适用于那里的“包装”。我没有收到任何错误，它只是不将 divA 与 divB 包装在一起，而只是自行插入 divA 。

我是不是对包装有什么误解？

更新：

一个更简单的示例，但不起作用：

$myBox.after($("<p></p>").wrap("<div></div>"));

这将仅在 myBox 之后添加 DIV。

看起来 jQuery 不喜欢在之后添加换行。

Answer 1

您是否

$myDiv.after($divA.wrap('<div class="divB"></div>'));

只是为了测试目的而尝试过？

据我了解，您不应该将 jQuery 对象传递给包装函数：

.wrap() 函数可以采用任何
可以传递的字符串或对象
到 $() 工厂函数来指定
DOM 结构。这个结构可能是
嵌套了几层深，但应该
仅包含一个最内部元素。这
结构将包裹在每个
匹配集合中的元素
元素。

如果上面的例子有效，那么这就是原因;-)

Answer 2

只是偶然发现这个线程有同样的问题： jQuery .wrap() 不工作

我想想如果你将代码从

$myDiv.after($divA.wrap($divB)) 更改为 $myDiv.after($divA.wrap($divB).parent())

你会得到你的包裹。

Answer 3

让您感到困惑的部分可能是 .wrap() 返回内部元素，而不是父元素。

因此，您必须像这样使用包装对象的 parent 对象：

var $divA= $("<div/>").addClass('classA'),
    $divB= $("<div/>").addClass('classB');

$myDiv.after($divA.wrap($divB).parent());

($divA.parent() 等于 $divB 之后因此

关键部分是 $divA.wrap($divB) 返回 $divA，而不是 $divB

请参阅参考：

此方法返回用于链接的原始元素集
目的。

http://api.jquery.com/wrap/

Answer 4

我得到了这个工作：

$('div#myDiv').after("<div class='classA'></div>").end().find('.classA').wrap("<div class='classB'></div>");

用你的 html 来解决你最初的问题。 这里是 jQuery 的 end 函数的源代码。此代码将使链上升一级（到 myDiv 级别），然后根据该级别的 find('.classA') 进行换行。这会发现你的div添加了after，并用classB将其包装在div中。

编辑：
好的，我认为这会按照您想要的方式为您工作：

var divA= $("<div></div>").addClass('classA');
$('div#myDiv').after($(divA).wrap('<div class="divB" />'));

我认为问题是当在 divA 上调用 wrap 时，它需要是一个 jQuery 对象才能正常工作。所以实际上您所缺少的就是将 divA 包装在 () 中。

Answer 5

你不是在寻找包装。你想要：

divB.append(divA).insertAfter('#myDiv');

Answer 6

我可能读错了，但是如果你使用 jQuery，$ 不是保留字符吗？您是否尝试过仅设置变量名称以便他们不使用它？

如果是这样：

var divA = $("<div></div>").addClass('classA');
divA.wrap("<div class=\"classB\"></div>");
divA.insertAfter($("#myDiv"));

或者

divA.after($("#myDiv"));

这是关于此事的 jQuery 文档。