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 相关文章推荐
用函数式编程技术编写优美的 JavaScript_ibm
May 16 Javascript
js中cookie的添加、取值、删除示例代码
Oct 21 Javascript
Jquery 获取对象的几种方式介绍
Jan 17 Javascript
Javascript模块化编程详解
Dec 01 Javascript
使用console进行性能测试
Apr 27 Javascript
javascript获取本机操作系统类型的方法
Aug 13 Javascript
Highcharts 多个Y轴动态刷新数据的实现代码
May 28 Javascript
jquery通过name属性取值的简单实现方法
Jun 20 Javascript
JS中Attr的用法详解
Oct 09 Javascript
Angular实现的简单定时器功能示例
Dec 28 Javascript
vue框架中props的typescript用法详解
Feb 17 Javascript
vue ant design 封装弹窗表单的使用
Jun 01 Vue.js
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
编译问题
2006/10/09 PHP
PHP中开发XML应用程序之基础篇 添加节点 删除节点 查询节点 查询节
2010/07/09 PHP
可以保证单词完整性的PHP英文字符串截取代码分享
2014/07/15 PHP
php遍历目录方法小结
2015/03/10 PHP
php实现图片转换成ASCII码的方法
2015/04/03 PHP
ThinkPHP3.2.3实现分页的方法详解
2016/06/03 PHP
javascript知识点收藏
2007/02/22 Javascript
JQuery 常用操作代码
2010/03/14 Javascript
判断字符串的长度(优化版)中文占两个字符
2014/10/30 Javascript
微信小程序 下拉菜单的实现
2017/04/06 Javascript
js 用于检测类数组对象的函数方法
2017/05/02 Javascript
基于vue.js中关于下拉框的值默认及绑定问题
2018/08/22 Javascript
基于Vue-Cli 打包自动生成/抽离相关配置文件的实现方法
2018/12/09 Javascript
Vue生命周期activated之返回上一页不重新请求数据操作
2020/07/26 Javascript
十条建议帮你提高Python编程效率
2016/02/16 Python
python中urlparse模块介绍与使用示例
2017/11/19 Python
python3写爬取B站视频弹幕功能
2017/12/22 Python
详解python 拆包可迭代数据如tuple, list
2017/12/29 Python
使用pandas对两个dataframe进行join的实例
2018/06/08 Python
Python骚操作之动态定义函数
2019/03/26 Python
python pip安装包出现:Failed building wheel for xxx错误的解决
2019/12/25 Python
python基于三阶贝塞尔曲线的数据平滑算法
2019/12/27 Python
用CSS3绘制三角形的简单方法
2015/07/17 HTML / CSS
捷克体育用品购物网站:D-sport
2017/12/28 全球购物
Hotels.com越南:酒店预订
2019/10/29 全球购物
北京捷通华声语音技术有限公司Java软件工程师笔试题
2012/04/10 面试题
关于廉洁的广播稿
2014/01/30 职场文书
市场开发与营销专业求职信范文
2014/05/01 职场文书
绿色环保演讲稿
2014/05/10 职场文书
中秋晚会活动方案
2014/08/31 职场文书
工作总结与自我评价
2014/09/18 职场文书
房产公证书格式
2015/01/26 职场文书
常务副总经理岗位职责
2015/02/02 职场文书
2015年评职称工作总结范文
2015/04/20 职场文书
培训讲师开场白
2015/06/01 职场文书
创业计划书之干洗店
2019/09/10 职场文书