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 相关文章推荐
JQuery中的$.getJSON 使用说明
Mar 10 Javascript
js实现星星打分效果的方法
Jul 05 Javascript
JS特效实现图片自动播放并可控的效果
Jul 31 Javascript
JavaScript控制浏览器全屏及各种浏览器全屏模式的方法、属性和事件
Dec 20 Javascript
JavaScript中的数组遍历forEach()与map()方法以及兼容写法介绍
May 19 Javascript
JavaScript 对象详细整理总结
Sep 29 Javascript
BootStrap Table 设置height表头与内容无法对齐的问题
Dec 28 Javascript
浅谈React + Webpack 构建打包优化
Jan 23 Javascript
详解vue2.0监听属性的使用心得及搭配计算属性的使用
Jul 18 Javascript
4个顶级JavaScript高级文本编辑器
Oct 10 Javascript
ant design实现圈选功能
Dec 17 Javascript
React服务端渲染原理解析与实践
Mar 04 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
PHP设计模式之观察者模式(Observer)详细介绍和代码实例
2014/04/08 PHP
ThinkPHP CURD方法之where方法详解
2014/06/18 PHP
PHP实现将HTML5中Canvas图像保存到服务器的方法
2014/11/28 PHP
Firebug 字幕文件JSON地址获取代码
2009/10/28 Javascript
js 创建快捷方式的代码(fso)
2010/11/19 Javascript
JavaScript中的变量声明早于赋值分析
2012/03/01 Javascript
使用jQuery重置(reset)表单的方法
2014/05/05 Javascript
node.js中的fs.openSync方法使用说明
2014/12/17 Javascript
AngularJS表达式讲解及示例代码
2016/08/16 Javascript
基于javascript的Form表单验证
2016/12/29 Javascript
js基于myFocus实现轮播图效果
2017/02/14 Javascript
vue中将网页打印成pdf实例代码
2017/06/15 Javascript
详解vue静态资源打包中的坑与解决方案
2018/02/05 Javascript
关于vue中 $emit的用法详解
2018/04/12 Javascript
使用canvas实现一个vue弹幕组件功能
2018/11/30 Javascript
关于node-bindings无法在Electron中使用的解决办法
2018/12/18 Javascript
vue 添加和编辑用同一个表单,el-form表单提交后清空表单数据操作
2020/08/03 Javascript
uniapp实现可以左右滑动导航栏
2020/10/21 Javascript
Vue中引入svg图标的两种方式
2021/01/14 Vue.js
python每隔N秒运行指定函数的方法
2015/03/16 Python
python中selenium操作下拉滚动条的几种方法汇总
2019/07/14 Python
python Django中models进行模糊查询的示例
2019/07/18 Python
pytho matplotlib工具栏源码探析一之禁用工具栏、默认工具栏和工具栏管理器三种模式的差异
2021/02/25 Python
深入浅出CSS3 background-clip,background-origin和border-image教程
2011/01/27 HTML / CSS
美国著名童装品牌:OshKosh B’gosh
2016/08/05 全球购物
英国领先的NHS批准的在线药店:Pharmacy2U
2017/01/06 全球购物
Lookfantastic瑞典:英国知名美妆购物网站
2018/04/06 全球购物
意大利体育用品和运动服网上商店:Maxi Sport
2019/09/14 全球购物
岗位职责定义及内容
2013/11/08 职场文书
主持词开场白
2014/03/17 职场文书
师范生自荐信模板
2014/05/28 职场文书
2014年财务工作总结与计划
2014/12/08 职场文书
环保建议书作文400字
2015/09/14 职场文书
阿里云Nginx配置https实现域名访问项目(图文教程)
2021/03/31 Servers
Django drf请求模块源码解析
2021/06/08 Python
微信小程序APP的生命周期及页面的生命周期
2022/04/19 Javascript