jquery - jquery追加为倒数第二

Question

我想在添加之前添加第 3 项。我该怎么做？我考虑过使用索引，但即使我知道它应该放在哪里，我仍然不知道如何附加它。无论如何，这是我的演示

HTML：

<div id="main">
    <div class="item">Item 1</div>
    <div class="item">Item 2</div>
    <div class="Add">Add</div>
</div>

JS：

$('<div class="item">Item 3</div>').appendTo('#main');

Answer 1

我建议：

$('<div class="item">Item 3</div>').insertBefore('div.add');

或者：

$('<div class="item">Item 3</div>').insertAfter('.item:last');

虽然我建议将节点创建中的语法更改为：

$('<div />',{class: 'item', text: 'Item 3'})

我发现以这种方式阅读会更容易一些（尽管绝对不是强制性的，甚至不是“最佳实践”）。

参考：

• insertAfter().
• insertBefore().

Answer 2

您可以在最后一个之后附加.item：

$('.item').last().after($('<div class="item">Item 3</div>'));

Answer 3

这可以通过在#main 中找到倒数第二个 div

var newItemHTML = '<div class="item">Item 3</div>',
    $secondLast = $('#main').find('div:last-child').prev();

$( newItemHTML ).insertAfter( $secondLast );