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 相关文章推荐
IE的有条件注释判定IE版本详解(附实例代码)
Jan 04 Javascript
js使用Array.prototype.sort()对数组对象排序的方法
Jan 28 Javascript
原生JavaScript编写俄罗斯方块
Mar 30 Javascript
JavaScritp添加url参数并将参数加入到url中及更改url参数的方法
Oct 26 Javascript
bootstrap laydate日期组件使用详解
Jan 04 Javascript
jQuery源码分析之init的详细介绍
Feb 13 Javascript
无循环 JavaScript(map、reduce、filter和find)
Apr 08 Javascript
JS实现的加减乘除四则运算计算器示例
Aug 09 Javascript
深入理解Node.js中通用基础设计模式
Sep 19 Javascript
用WebStorm进行Angularjs 2开发(环境篇:Windows 10,Angular-cli方式)
Dec 05 Javascript
jQuery 判断元素是否存在然后按需加载内容的实现代码
Jan 16 jQuery
node运行js获得输出的三种方式示例详解
Jul 02 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 编写的日历
2006/10/09 PHP
实测在class的function中include的文件中非php的global全局环境
2013/07/15 PHP
PHP explode()函数的几个应用和implode()函数有什么区别
2015/11/05 PHP
JS+CSS实现仿新浪微博搜索框的方法
2015/02/24 Javascript
javascript制作网页图片上实现下雨效果
2015/02/26 Javascript
js实现文本框选中的方法
2015/05/26 Javascript
javascript验证邮件地址和MX记录的方法
2015/06/16 Javascript
IE6兼容透明背景图片及解决方案
2015/08/19 Javascript
JavaScript实现的简单烟花特效代码
2015/10/20 Javascript
AngualrJS中的Directive制作一个菜单
2016/01/26 Javascript
高效Web开发的10个jQuery代码片段
2016/07/22 Javascript
浅谈js算法和流程控制
2016/12/29 Javascript
详解使用vue-router进行页面切换时滚动条位置与滚动监听事件
2017/03/08 Javascript
微信小程序 MD5的方法详解及实例代码
2017/03/10 Javascript
javascript数据结构之多叉树经典操作示例【创建、添加、遍历、移除等】
2018/08/01 Javascript
js实现通过开始结束控制的计时器
2019/02/25 Javascript
Bootstarp在pycharm中的安装及简单的使用方法
2019/04/19 Javascript
小程序按钮避免多次调用接口和点击方案实现(不用showLoading)
2020/04/15 Javascript
jQuery+ThinkPHP实现图片上传
2020/07/23 jQuery
Python中操作MySQL入门实例
2015/02/08 Python
python函数局部变量用法实例分析
2015/08/04 Python
centos 安装python3.6环境并配置虚拟环境的详细教程
2018/02/22 Python
详解python3中zipfile模块用法
2018/06/18 Python
使用numba对Python运算加速的方法
2018/10/15 Python
使用Fabric自动化部署Django项目的实现
2019/09/27 Python
关于pandas的离散化,面元划分详解
2019/11/22 Python
解决matplotlib.pyplot在Jupyter notebook中不显示图像问题
2020/04/22 Python
HTML5移动开发图片压缩上传功能
2016/11/09 HTML / CSS
回馈慈善的设计师太阳镜:DIFF eyewear
2019/10/17 全球购物
Lentiamo丹麦:购买便宜的隐形眼镜
2021/01/13 全球购物
软件测试有哪些?什么是配置项?
2012/02/12 面试题
幼儿园门卫岗位职责范本
2014/07/02 职场文书
校园广播稿精选
2014/10/01 职场文书
外贸业务员岗位职责
2015/02/13 职场文书
Python+tkinter实现高清图片保存
2022/03/13 Python
Nginx实现会话保持的两种方式
2022/03/18 Servers