javascript - 不添加最后一个元素

Question

<div id="container">
    <div class="sub">a</div>

    <span id="add">add</span>
</div>            

$('#add').click(function(){
   $('#container').append('<div class="sub">a</div>');
})

这个附加元素到底部的#container。如何在没有最后一个元素（#add）的情况下在底部添加这个元素？我希望总是在底部添加#add。

小提琴：http: //jsfiddle.net/nk67d/

Answer 1

使用.before()，它在匹配的元素之前添加标记。

$('#add').before('<div class="sub">a</div>');

要完成答案：

$('#add').click(function(){
   $(this).before('<div class="sub">a</div>');
});

Answer 2

使用insertBefore(target)；

$('<div class="sub">a</div>').insertBefore("#add");

你也可以使用before()

Answer 3

使用.before()方法div在添加按钮之前插入

$('#add').click(function(){
   $(this).before('<div class="sub">a</div>');  
});

Answer 4

$('#add').click(function(){
   $(this).before('<div class="sub">a</div>');
})

在这里演示

Answer 5

尝试

$("#add").prepend('<div class="sub">a</div>');

见小提琴：http: //jsfiddle.net/nk67d/1/

Answer 6

$('#add').click(function(){
    $('#container #add').before('<div class="sub">abcd</div>');
})