首页日志正文
javascript给不同的标签加不同的样式
日期:2020-5-9 15:45:27 人气:21
<ul class="sub1">
<li class="drivers"><a href="">角色管理</a></li>
<li class="drivers"><a href="">用户管理</a></li>
<li class="drivers"><a href="">部门管理</a></li>
<li class="drivers"><a href="">客户管理</a></li>
</ul>
<ul class="sub2">
<li class="drivers"><a href="">角色管理</a></li>
<li class="drivers"><a href="">用户管理</a></li>
<li class="drivers"><a href="">部门管理</a></li>
<li class="drivers"><a href="">客户管理</a></li>
</ul>
<ul class="sub3">
<li class="drivers"><a href="">角色管理</a></li>
<li class="drivers"><a href="">用户管理</a></li>
<li class="drivers"><a href="">部门管理</a></li>
<li class="drivers"><a href="">客户管理</a></li>
</ul>
<ul class="sub4">
<li class="drivers"><a href="">角色管理</a></li>
<li class="drivers"><a href="">用户管理</a></li>
<li class="drivers"><a href="">部门管理</a></li>
<li class="drivers"><a href="">客户管理</a></li>
<li class="drivers"><a href="">角色管理</a></li>
<li class="drivers"><a href="">用户管理</a></li>
<li class="drivers"><a href="">部门管理</a></li>
<li class="drivers"><a href="">客户管理</a></li>
</ul>
<script type="text/javascript">
//第一个和最后一个添加class
$('ul.sub1').each(function(){
$(this).children(':first').addClass('aaa')
$(this).children(':last').addClass('bbb')
})
//每个里加一个不同的ID
$('.sub2 li').each(function(index, item){
$(item).attr('id', 'id-' + index+1); //id以100开始递增50 (100.150.200) 就写index*50+100
});
//每个li标签加不同的class
$('.sub3 li').each( function(i,e){ $(e).addClass('select'+i); });
//每隔2个给li加一个样式
$(".sub4 li:nth-child(2n-2)").addClass("last")
</script>
</body>