jQuery修改li下的样式以及li下的img的src的值的方法


Posted in Javascript onNovember 02, 2014

jQuery如何修改li下的样式,以及修改li下的img的src的值,下面是具体的实现代码,需要的朋友可以看看

$(".test li").click(function() {
$(".test li a").removeClass("test01");
$(".test li a").addClass("test02");
$("a", this).removeClass("test02");//当前li中的a标签
$("a", this).addClass("test01");
var title_index = $(this).index();//当前li的index
//li中所有的img
var allImg = $(".test li img");
for ( var i = 0; i < allImg.size(); i++) {
if (i % 2 == 0) {
$(allImg[i]).attr("src", "images/b04.gif");//改变img的src
} else {

$(allImg[i]).attr("src", "images/b05.gif");
}
}
//当前li中的img
var imgs = $("img", this);
for ( var i = 0; i < imgs.size(); i++) {
if (i == 0) {
$(imgs[i]).attr("src", "images/b01.gif");
} else {

$(imgs[i]).attr("src", "images/b02.gif");
}

}
if (title_index == 0) {
$("#a).hide();
$("#b").show();
} else {
$("#b").hide();
$("#a").show();
} 
})
Javascript 相关文章推荐
event.srcElement+表格应用
Aug 29 Javascript
js 页面传参数时 参数值含特殊字符的问题
Dec 13 Javascript
jQuery代码优化之基本事件
Nov 01 Javascript
js+css绘制颜色动态变化的圈中圈效果
Jan 27 Javascript
JavaScript自定义函数实现查找两个字符串最长公共子串的方法
Nov 24 Javascript
js实现滑动到页面底部自动加载更多功能
Feb 15 Javascript
微信小程序url与token设置详解
Sep 26 Javascript
解析vue中的$mount
Dec 21 Javascript
VeeValidate在vue项目里表单校验应用案例
May 09 Javascript
javascript实现摄像头拍照预览
Sep 30 Javascript
Ant Design Pro 下实现文件下载的实现代码
Dec 03 Javascript
Vue组件基础用法详解
Feb 05 Javascript
jQuery中ajax和post处理json的不同示例对比
Nov 02 #Javascript
一款基jquery超炫的动画导航菜单可响应单击事件
Nov 02 #Javascript
加载列表时jquery获取ul中第一个li的属性
Nov 02 #Javascript
基于jquery固定于顶部的导航响应浏览器滚动条事件
Nov 02 #Javascript
jQuery ajax serialize() 方法使用示例
Nov 02 #Javascript
js获取UserControl内容为拼html时提供方便
Nov 02 #Javascript
Javscript调用iframe框架页面中函数的方法
Nov 01 #Javascript
You might like
Yii2创建多界面主题(Theme)的方法
2016/10/08 PHP
Laravel5.4框架使用socialite实现github登录的方法
2019/03/20 PHP
JavaScript中__proto__与prototype的关系深入理解
2012/12/04 Javascript
页面元素绑定jquery toggle后元素隐藏的解决方法
2014/03/27 Javascript
javascript中DOM复选框选择用法实例
2015/05/14 Javascript
快速掌握Node.js之Window下配置NodeJs环境
2016/03/21 NodeJs
微信小程序 获取javascript 里的数据
2017/08/17 Javascript
JavaScript 有用的代码片段和 trick
2018/02/22 Javascript
json前后端数据交互相关代码
2018/09/19 Javascript
浅谈Javascript常用正则表达式应用
2019/03/08 Javascript
浅入深出Vue之组件使用
2019/07/11 Javascript
Vue2.X和Vue3.0数据响应原理变化的区别
2019/11/07 Javascript
微信小程序登陆注册功能的实现代码
2019/12/10 Javascript
Node.js中出现未捕获异常的处理方法
2020/06/29 Javascript
TypeScript 引用资源文件后提示找不到的异常处理技巧
2020/07/15 Javascript
electron踩坑之dialog中的callback解决
2020/10/06 Javascript
Python循环语句之break与continue的用法
2015/10/14 Python
python flask实现分页效果
2017/06/27 Python
Python实现输出程序执行进度百分比的方法
2017/09/16 Python
Python+matplotlib实现华丽的文本框演示代码
2018/01/22 Python
使用Python进行QQ批量登录的实例代码
2018/06/11 Python
10个python3常用排序算法详细说明与实例(快速排序,冒泡排序,桶排序,基数排序,堆排序,希尔排序,归并排序,计数排序)
2020/03/17 Python
python实现手势识别的示例(入门)
2020/04/15 Python
Python3 selenium 实现QQ群接龙自动化功能
2020/04/17 Python
在spyder IPython console中,运行代码加入参数的实例
2020/04/20 Python
使用PyQt的QLabel组件实现选定目标框功能的方法示例
2020/05/19 Python
python 制作python包,封装成可用模块教程
2020/07/13 Python
您的网上新华书店:文轩网
2016/08/24 全球购物
英国天然宝石首饰购买网站:Gemondo Jewellery
2018/10/23 全球购物
荷兰街头时尚之家:Funkie House
2019/03/18 全球购物
美国家居装饰店:Z Gallerie
2020/12/28 全球购物
介绍一下MD5加密算法
2016/11/12 面试题
中班中秋节活动反思
2014/02/18 职场文书
社团活动总结范文
2014/04/26 职场文书
监察建议书
2015/02/04 职场文书
一篇文章弄懂Python关键字、标识符和变量
2021/07/15 Python