Javascript，将动态类添加到相同类型的所有元素

Question

我想知道如何使用javascript在html页面上为某些类型的所有元素添加动态类？

我需要这个来区分页面中的输入元素。

示例：

<p class="n+1">input</p>
<p class="n+2">input</p>

有办法吗？

Answer 1

使用$()选择元素，然后循环通过函数传递addClass添加类; jQuery将使用文档中每个元素的基于0的索引调用该函数。

  

第一个P获得class =“p1”，第二个P获得class =“p2”等

因为索引是从0开始的，所以我们必须添加一个：

$("p").addClass(function(index) {
    return "p" + (index + 1);
});

直播示例：

$("p").addClass(function(index) {
  return "p" + (index + 1);
});

.p1 {
  color: blue;
}
.p2 {
  color: green;
}
.p3 {
  color: #990;
}

<p>one</p>
<p>two</p>
<p>three</p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 2

试试这个：

$('p').each(function(i,op)
{
   $(this).addClass("p" + (i+1));
});

这会将类“p1，p2，p2 ...”添加到每个唯一的p元素。