JQuery .insertAfter 在此示例中不起作用 - 为什么？

Question

我不确定为什么我的 jquery 代码不起作用。我正在创建一个 WordPress 主题供我的公司使用，但我似乎无法让 .insertAfter() 函数正常工作。它只是删除页面上的所有内容。

<div class='entry'>
<ul>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
</ul>
<ul>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
</ul>
</div>

JQuery 部分:

$('.entry:first-child').insertAfter($('.entry:last-child'));

有什么想法吗？

Answer 1

您的.entry:first-child正在选择div本身，而我认为它应该选择第一个ul。因此，您当前正在尝试在其自身之后插入一个元素，但这是行不通的。

console.log($('.entry:first-child')[0] == $('.entry:last-child')[0]); // true

试试这个...

$('.entry ul:first-child').insertAfter('.entry ul:last-child');

jsFiddle .

您还可以看到，只需将选择器字符串传递给 insertAfter 即可，无需使用 $() 再次将其包裹起来。