jquery遍历多个li_JQuery中使用.each()遍历元素学习笔记

这篇博客介绍了作者在使用jQuery遍历li元素时遇到的问题及解决方案。在选项卡功能中,使用.each()遍历li并根据index切换对应的div内容。起初因页面中存在其他li元素导致索引匹配错误,通过限制li的选择器范围解决了这个问题。
摘要由CSDN通过智能技术生成

今天写一个选项卡的时候,需要用到jquery中的.each(),通过获取each()中的index参数来获取li元素的编号,方便下面区块显示,在一个测试页面上写好了下面的代码:

tab选项卡

ul,li{list-style: none;margin: 0px; padding: 0px;}

li{float: left;width: 80px; height: 30px; background-color: #ccc; border: 2px solid #fff;text-align:center; line-height:30px;}

#content{clear:left; width:336px; height: 180px; background-color: #999; color:white;}

#content div{display: none}

#content .consh{display: block;}

#title .titsh{background-color: #999;border:2px solid #999; color:#fff}

$(function(){

$("li").each(function(index){

$(this).mouseover(function(){

$("#title .titsh").removeClass("titsh");

$("#content .consh").removeClass("consh");

$(this).addClass("titsh");

$("#content>div:eq("+index+")").addClass(&#

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值