如何使用javascript或jquery在两个或多个</li> <li>元素之间添加新的<li>元素？</li>

Question

我有以下<ul>和<li>元素：

<ul>
<li>a element</li>
<li>b element</li>
<li>c element</li>
<li>d element</li>
<li>e element</li>
<li>f element</li>
</ul>

比我想添加一个新的<li>元素

<li>abc element</li>

beetween

<li>b element</li>

和

<li>c element</li>

例如：

<ul>
<li>a element</li>
<li>b element</li>
<li>abc element</li>
<li>c element</li>
<li>d element</li>
<li>e element</li>
<li>f element</li>
</ul>

我该怎么做（如果可能的话）？

Answer 1

您可以使用jQuery中的eq方法选择列表中的特定项目。

$('ul li').eq(1).after("<li>abc element</li>")

请记住，eq是从零开始的，所以第一个元素是0。

Answer 2

使用它。这将从ul元素下降到li

的第二个子元素

$(function(){
 $("ul li:nth-child(2)").append( "<li>abc element</li>" );
});

Answer 3

尝试：

$('ul li:nth-child(2)').after('<li >abc element</li>');

在nth-child()中，您可以指定要在哪个孩子后插入li

此处nth-child(2)将在第二个 li之后添加，如您所希望的那样

DEMO

Answer 4

这些网站在尝试选择时可能会派上用场：

• Jquery Selectors (jQuery API)
• Jquery Selectors (w3schools)

对于其他人，我建议你自己玩，直到你得到你想要的东西。这样你自己也可以学到更多东西。

希望它有所帮助！

另外，如果您使用jQuery，请不要忘记在您的网站中包含jQuery文件！