替换每个第n个类名,并在jQuery的帮助下进行替换

Replace every nth class name and replace it with the help of jQuery

本文关键字:替换 帮助 jQuery 并在      更新时间:2023-09-26

我想替换每6个div类。

这是我当前的代码

<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div> this should be change
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div> this should be change
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div> this should be change
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>

它是不受限制和未定义的计数,因为它在的每个部分都有变化

你可以试试这个:

$( "div:nth-child(6n)" ).removeClass("disp");

$( "div.disp:nth-child(6n)" ).removeClass("disp");
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div> 
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div> 
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>
<div class="disp">...</div>

使用纯css 进行此操作

div {
    width:50px;
    height:50px;
    background:black;
    margin:10px;
}
section > div:nth-child(6n) {
    background:red;
}

这里也可以用jquery 来实现

 $( "div:nth-child(6n)" ).removeClass("disp");

如需更多参考,请点击此链接每隔三个元素设置样式?