我需要为每个<a>
提供不同的类。
我只能用js / jquery来做。
<ul class="ulClass">
<li><a></a></li>
<li><a></a></li>
<li><a></a></li>
<li><a></a></li>
</ul>
我试图给他们提供类(className1,className2,className3):
jQuery(document).ready(function(){
var classNumber = 1;
var className = "className" + classNumber;
jQuery(".ulClass:nth-child(1)").addClass(className + classNumber++);
jQuery(".ulClass:nth-child(2)").addClass(className + classNumber++);
jQuery(".ulClass:nth-child(3)").addClass(className + classNumber++);
jQuery(".ulClass:nth-child(4)").addClass(className + classNumber++);
});
我的代码只为ul
元素提供了类名...此外它是className11
。这里出了什么问题?
答案 0 :(得分:2)
您可以使用.each()jQuery方法迭代链接
See the documentation
这样,您就可以使用循环的当前迭代索引作为类名。
$(".ulClass a").each(function(index){
$(this).addClass("className" + index);
});
答案 1 :(得分:1)
你可以这样做:
var classNumber = 1;
$(".ulClass a").each(function(){
var className = "className" + classNumber;
$(this).addClass(className);
classNumber++;
});
答案 2 :(得分:1)
此处结帐Jsfiddle。
为无序列表中的<a>
元素设置唯一的类名。您可以使用$(".ulClass a").each
迭代每个“a”,然后在当前上下文addClass(className)
上使用this
。
因为你希望锚标签有一个唯一的类名,所以我使用的是一个classNum
变量,它在每次迭代后递增1。
var classNum = 1;
$(".ulClass a").each(function(){
var className = "className" + classNum;
$(this).addClass(className);
classNum++;
});