JQuery .insertAfter在这个例子中不起作用 - 为什么？

我不知道为什么我的jQuery代码不工作。我为我的公司创建了一个Wordpress主题，我似乎无法使.insertAfter（）函数正常工作。它只是删除页面上的所有内容。JQuery .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'));

任何想法？

来源

2011-03-18 Ryan

你的.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，您不需要再使用$()将其包装。

来源

2011-03-18 01:05:01 alex

非常感谢Alex。我一直在摆弄这个很长一段时间，老实说，我以为我试过你的解决方案。但是，事实证明我没有！奇迹般有效。谢谢吨家伙。 – Ryan 2011-03-18 19:29:16

这应该工作：

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

http://jsbin.com/ihihi4/5

亚历克斯指出，你可能会在.insertAfter通话，而不是一个jQuery对象使用的另一种选择。

jQuery的文档是伟大的解释是：

http://api.jquery.com/insertAfter/

值得注意的是insertAfter之间和之后的细微差别。

http://api.jquery.com/after

这同样适用于的insertBefore /前和appendTo和追加。了解差异很有用。

来源

2011-03-18 01:04:47 ScottE

这是一个令人困惑的名字，因为它不是“找到具有该类的元素”条目，然后选择其第一个子元素。“ jQuery文档说：“[First-child]选择[它们自己]是其父代的第一个孩子的所有元素。”在这种情况下，你的div.entry。

来源

2011-03-18 01:09:16

JQuery .insertAfter在这个例子中不起作用 - 为什么？

回答

相关问题