jquery - Javascript，为所有相同类型的元素添加动态类

Question

我想知道如何使用 javascript 将动态类添加到 html 页面上特定类型的所有元素？

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

例子:

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

有办法吗？

Answer 1

您使用$() 选择元素，然后通过addClass 循环添加一个类。传入函数； jQuery 将使用文档中每个元素的从 0 开始的索引调用该函数。

First P gets class="p1", second P gets class="p2" etc

因为索引是从 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>