Question

我正在尝试使用jquery在ul中添加li。无法通过以下行添加li。会是什么问题？

我的小提琴是here

sns.load_dataset

Answer 1

最干净的解决方案是 $(".custom-menu").append('<li> hey test ...</li>');，正如LXhelili和j08691所解释的那样。由于append将指定的内容作为jQuery集合中每个元素的最后一个子元素插入，因此您不需要指定:last。

编辑以解决以下评论。

Answer 2

您希望将.after()与li:last一起使用，而不是.append()或ul:last

$(".custom-menu li:last").after('<li> hey test ...</li>');

 $(".custom-menu li:last").after('<li> hey test ...</li>');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class='custom-menu'>
  <li data-action="first">First thing</li>
  <li data-action="second">Second thing</li>
  <li data-action="third">Third thing</li>
</ul>

或者您可以.append()使用<ul>本身（不需要:last）：

$(".custom-menu").append('<li> hey test ...</li>');

，.append()默认情况下将内容作为最后一个子项插入。

 $(".custom-menu").append('<li> hey test ...</li>');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class='custom-menu'>
  <li data-action="first">First thing</li>
  <li data-action="second">Second thing</li>
  <li data-action="third">Third thing</li>
</ul>

.after() ：在匹配元素集中的每个元素之后插入内容。

.append() ：将内容插入到匹配元素集中每个元素的末尾。 .append（）方法将指定的内容作为jQuery集合中每个元素的最后一个子元素

注意两者之间的区别。 .after()在您指定的元素之后插入内容，而.append()将内容插入您指定的元素的最后一个子元素。

Answer 3

这样。

 $(".custom-menu").append('<li> hey test ...</li>');
 //$(".custom-menu ul").append('<li> hey test ...</li>');
 console.log($('.custom-menu').html());

https://jsfiddle.net/cbfys0o0/

Answer 4

您需要将选择器从.custom-menu ul:last更改为ul.custom-menu:last。

.custom-menu ul:last定位ul内的最后一个.custom-menu元素。

ul.custom-menu:last定位课程ul的最后一个.custom-menu元素。

Here's an updated fiddle

Answer 5

$(".custom-menu ul:last").append定位ul内的最后一个.custom-menu，ul本身就是li。您要做的是在.custom-menu内附加$(".custom-menu").append('<li> hey test ...</li>');。所以你的代码应该是：

$(".custom-menu li:last").after('<li> hey test ...</li>');

或者，或者：

length

请参阅fiddle。

jquery无法将li添加到ul

5 个答案: