jQuery实现table隔行换色和鼠标经过变色的两种方法


Posted in Javascript onJune 15, 2014

一、隔行换色

$("tr:odd").css("background-color","#eeeeee"); 
$("tr:even").css("background-color","#ffffff");

或者一行搞定:
$("table tr:nth-child(odd)").css("background-color","#eeeeee");

:nth-child 匹配其父元素下的第N个子或奇偶元素

二、鼠标经过变色

$("tr").live({ 
mouseover:function(){ 
$(this).css("background-color","#eeeeee"); 
}, 
mouseout:function(){ 
$(this).css("background-color","#ffffff"); 
} 
})

或者
$("tr").bind("mouseover",function(){ 
$(this).css("background-color","#eeeeee"); 
}) 
$("tr").bind("mouseout",function(){ 
$(this).css("background-color","#ffffff"); 
})

当然live()和bind()都可以同时绑定多个事件或分开。
Javascript 相关文章推荐
json简单介绍
Jun 10 Javascript
jQuery(1.3.2) 7行代码搞定跟随屏幕滚动的层
May 21 Javascript
JavaScript类型转换方法及需要注意的问题小结(挺全面)
Nov 11 Javascript
禁止IE用右键的JS代码
Dec 30 Javascript
javascript中indexOf技术详解
May 07 Javascript
js实现各种复制到剪贴板的方法(分享)
Oct 27 Javascript
原生js实现日期计算器功能
Feb 17 Javascript
微信小程序 wx.login解密出现乱码的问题解决办法
Mar 10 Javascript
js 数字、字符串、布尔值的转换方法(必看)
Apr 07 Javascript
vue-router 源码之实现一个简单的 vue-router
Jul 02 Javascript
JS中准确判断变量类型的方法
Jun 01 Javascript
解决VantUI popup 弹窗不弹出或无蒙层的问题
Nov 03 Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
Jun 15 #Javascript
Javascript实现简单二级下拉菜单实例
Jun 15 #Javascript
jQuery $.extend()用法总结
Jun 15 #Javascript
解决自定义$(id)的方法与jquery选择器$冲突的问题
Jun 14 #Javascript
使用jQuery判断IE浏览器版本的代码
Jun 14 #Javascript
jQuery Migrate 1.1.0 Released 注意事项
Jun 14 #Javascript
zeroclipboard 单个复制按钮和多个复制按钮的实现方法
Jun 14 #Javascript
You might like
php下利用curl判断远程文件是否存在的实现代码
2011/10/08 PHP
php中删除数组的第一个元素和最后一个元素的函数
2015/03/07 PHP
PHP开发的微信现金红包功能示例
2017/06/29 PHP
PPK 谈 JavaScript 的 this 关键字 [翻译]
2009/09/29 Javascript
jQuery基础知识filter()和find()实例说明
2010/07/06 Javascript
IE6/7/8中Option元素未设value时Select将获取空字符串
2011/04/07 Javascript
js使用ajax读博客rss示例
2014/05/06 Javascript
JavaScript实现从数组中选出和等于固定值的n个数
2014/09/03 Javascript
node.js中的fs.writeFileSync方法使用说明
2014/12/14 Javascript
Js制作点击输入框时默认文字消失的效果
2015/09/05 Javascript
AngularJS应用开发思维之依赖注入3
2016/08/19 Javascript
JavaScript基本类型值-Number类型
2017/02/24 Javascript
如何使用JS在HTML中自定义字符串格式化
2017/07/20 Javascript
对Angular中单向数据流的深入理解
2018/03/31 Javascript
vue + element-ui的分页问题实现
2018/12/17 Javascript
javascript数组去重方法总结(推荐)
2019/03/20 Javascript
mpvue实现小程序签到金币掉落动画(api实现)
2019/10/17 Javascript
vue遍历对象中的数组取值示例
2019/11/07 Javascript
老生常谈python的私有公有属性(必看篇)
2017/06/09 Python
Python tkinter模块弹出窗口及传值回到主窗口操作详解
2017/07/28 Python
pandas DataFrame实现几列数据合并成为新的一列方法
2018/06/08 Python
Python实现处理逆波兰表达式示例
2018/07/30 Python
python交易记录整合交易类详解
2019/07/03 Python
使用Python代码实现Linux中的ls遍历目录命令的实例代码
2019/09/07 Python
基于TensorBoard中graph模块图结构分析
2020/02/15 Python
Python基于numpy模块实现回归预测
2020/05/14 Python
Python datetime模块使用方法小结
2020/06/18 Python
StubHub智利:购买和出售您的门票
2016/11/23 全球购物
Europcar美国/加拿大:预订汽车或卡车租赁服务
2018/11/13 全球购物
新西兰Bookabach:查找全球度假屋
2020/12/03 全球购物
校园歌咏比赛主持词
2014/03/18 职场文书
办理房产过户的委托书
2014/09/14 职场文书
辞职离别感言
2015/08/04 职场文书
2017春节晚会开幕词
2016/03/03 职场文书
python中字符串String及其常见操作指南(方法、函数)
2022/04/06 Python
JavaScript前端面试组合函数
2022/06/21 Javascript