jQuery在元素之前前置

时间:2010-11-17 07:07:07

标签: jquery html prepend

我有一个像这样的

的html结构
<li id="1"></li>
<li id="2"></li>
<li id="3"></li>
<li id="comment-box"></li>

现在我想要前言

<li id="4"></li>

在评论框之前。

我从评论栏提交表格,一旦成功,我想做前置。

4 个答案:

答案 0 :(得分:32)

使用before()

$('#comment-box').before('<li id="4"></li>')

答案 1 :(得分:4)

这不会更有意义吗?:

$('ul#comments_container').prepend('<li id="4"></li>');

$('<li id="4"></li>').hide().prependTo('Ul#comments_container').slideDown("slow");

这将允许您将其添加到ul列表的开头以将其放在列表的末尾,只需使用'append'而不是'prepend'或'appendTo'也可以。

答案 2 :(得分:0)

将元素附加到元素上的情况并不常见,但可能的情况是插入未知长度的匹配元素的特定索引。

如果你知道列表中有多少项,那么你可以使用nth-child或:eq直接访问该项,而无需将你的标记类名或id连接到jQuery选择器中。

$('li:nth-child(3)')选择第三个<li>$('li:eq(3)')选择第四个,因为:eq为零。

在您的情况下,我的偏好将是以下

$('li:last').prepend('<li>Fourth item</li>');

Here is a fiddle

答案 3 :(得分:0)

如果您严格要使用.prepend(),以下内容将对您有所帮助:

// this gives you a list with all matching elements
var elementsList = $("li");  

// this refers to an element at required index and wraps it into a jQuery object           
var elementAtIndex = $(elementsList[your index]);   

// and finally apply change
elementAtIndex.prepend("<li id=\"4\"></li>");

OR

同样,使用.eq(),在获得主要想法后会更优雅。 .eq允许您引用特定索引。

 var elementAtIndex= $("li").eq(your index);  
 elementAtIndex.prepend("<li id=\"4\"></li>");

最后我们来到最后的短片:

 $("li").eq(index).prepend("<li id=\"4\"></li>");