Question

我试图通过在列表项中附加1到4来将数组的内容添加到页面上的每个列表中。我遇到的问题是我不能对每个列表执行此操作，如果它们只有3个列表项，我不想添加另一个项目，只需在3处结束列表。我也想要删除0。

提前致谢！

var levels = [ "1", "2", "3", "4" ];
$('ul li').each(function (x) {
 $(this).append(levels[x]);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<ul>
 <li>0</li>
 <li>0</li>
 <li>0</li>
 <li>0</li>
</ul>

<ul>
 <li>0</li>
 <li>0</li>
 <li>0</li>
</ul>

<ul>
 <li>0</li>
 <li>0</li>
 <li>0</li>
 <li>0</li>
</ul>

FIDDLE

Answer 1

首先迭代列表，然后迭代每个列表的列表项

var levels = [ "1", "2", "3", "4" ];

$('ul').each(function(i, ul) {
    $(ul).find('li').each(function(j, li) {
        $(this).html(levels[j]);
    });
});

FIDDLE

Answer 2

使用 :nth-child() 和 jQuery.each()

var levels = ["1", "2", "3", "4"];
$.each(levels, function(i, x) {
  $('ul li:nth-child(' + (i + 1) + ')').html(x);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<ul>
  <li>0</li>
  <li>0</li>
  <li>0</li>
  <li>0</li>
</ul>

<ul>
  <li>0</li>
  <li>0</li>
  <li>0</li>
</ul>

<ul>
  <li>0</li>
  <li>0</li>
  <li>0</li>
  <li>0</li>
</ul>

在单独的ul中为每个列表项追加一个数组

2 个答案: