Question

这一点，我肯定是关于JavaScript的一个非常基本的问题，所以请提前道歉。

我有简单的无序列表：

<ul>
   <li><a href="">Item number 1</a></li>
   <li><a href="">Item number 2</a></li>
   <li><a href="">Item number 3</a></li>
   <li><a href="">Item number 4</a></li>
   <li><a href="">Item number 5</a></li>
</ul>

我如何能够为这5个项目添加增量数字，所以我得到了：

<ul>
   <li><span>1</span><a href="">Item number 1</a></li>
   <li><span>2</span><a href="">Item number 2</a></li>
   <li><span>3</span><a href="">Item number 3</a></li>
   <li><span>4</span><a href="">Item number 4</a></li>
   <li><span>5</span><a href="">Item number 5</a></li>
</ul>

增量变量背后的逻辑是让我。

Answer 1

您可以使用$.each使用回调函数上的index参数迭代元素，然后使用当前元素构建span元素，并将其添加到li ：

$('ul li').each(function (i) {
  $('<span>'+ (i+1) +'</span>').prependTo(this);
  // or $('<span></span>').html(i+1).prependTo(this);
});

检查上面的代码段here。

请注意，我正在向索引i+1添加一个，这是因为索引是从零开始的，我也将括号括在括号中，因为它位于字符串连接的中间。

Answer 2

在步骤中它看起来像这样：

你拿走所有LI项目并通过添加span（lis [index] +1）来迭代所有这些项目
下次插入LI元素时，请插入文本为lis.length + 1的span。

如何使用Javascript / Jquery插入增量变量？

2 个答案: