表格奇偶行设置不同颜色的核心JS代码


Posted in Javascript onDecember 24, 2013

这是一个比较实用的功能,设置奇偶行颜色不同后阅读表格数据的体验明显变好,否则数据会显得非常繁杂拥挤(当表格数据行多时体验尤为明显)。只有当你自己真正做这方面的东西接触到时才有强烈的体会,反正我是刚刚经历了,留在这里备参考吧~

核心JS脚本代码如下(table元素的id根据自己的情况调整,代码中的jquery-1.7.min.js可以到jquery的官网上下载)

<script src="jquery-1.7.min.js"></script> 
<script> 
$(document).ready(function(){ 
SetTableRowColor(); }); 
//用CSS控制奇偶行的颜色 
function SetTableRowColor() 
{ 
$("#Table tr:odd").css("background-color", "#e6e6fa"); 
$("#Table tr:even").css("background-color", "#fff0fa"); 
} 
</scirpt>
Javascript 相关文章推荐
9个javascript语法高亮插件 推荐
Jul 18 Javascript
jquery关于页面焦点的定位(文本框获取焦点时改变样式 )
Sep 10 Javascript
JavaScript中判断对象类型的几种方法总结
Nov 11 Javascript
浅析JavaScript中的delete运算符
Nov 30 Javascript
javascript正则表达式中分组详解
Jul 17 Javascript
详解JavaScript的内置对象
Dec 07 Javascript
几种tab切换详解
Feb 03 Javascript
微信小程序 选项卡的简单实例
May 24 Javascript
详解AngularJS 过滤器的使用
Jun 02 Javascript
jQuery md5加密插件jQuery.md5.js用法示例
Aug 24 jQuery
实例分析vue循环列表动态数据的处理方法
Sep 28 Javascript
浅析js实现网页截图的两种方式
Nov 01 Javascript
js中function()使用方法
Dec 24 #Javascript
document节点对象的获取方式示例介绍
Dec 24 #Javascript
JQuery结合CSS操作打印样式的方法
Dec 24 #Javascript
jQuery动态改变图片显示大小(修改版)的实现思路及代码
Dec 24 #Javascript
jquery自动切换tabs选项卡的具体实现
Dec 24 #Javascript
从数组中随机取x条不重复数据的JS代码
Dec 24 #Javascript
JS过滤url参数特殊字符的实现方法
Dec 24 #Javascript
You might like
PHP parse_url 一个好用的函数
2009/10/03 PHP
php 静态变量的初始化
2009/11/15 PHP
PHP中MVC模式的模板引擎开发经验分享
2011/03/23 PHP
php中实现简单的ACL 完结篇
2011/09/07 PHP
PHP中遇到BOM、编码导致json_decode函数无法解析问题
2014/07/02 PHP
PHP设置Cookie的HTTPONLY属性方法
2017/02/09 PHP
谈谈从phpinfo中能获取哪些值得注意的信息
2017/03/28 PHP
php 截取中英文混合字符串的方法
2018/05/31 PHP
javascript 对象定义方法 简单易学
2009/03/22 Javascript
js css后面所带参数含义介绍
2013/08/18 Javascript
javascript设置金额样式转换保留两位小数示例代码
2013/12/04 Javascript
jquery实现图片翻页效果
2013/12/23 Javascript
Javascript前端UI框架Kit使用指南之kitjs的对话框组件
2014/11/28 Javascript
jQuery EasyUI tree 使用拖拽时遇到的错误小结
2016/10/10 Javascript
浅谈vue-router 路由传参的方法
2017/12/27 Javascript
angularjs实现分页和搜索功能
2018/01/03 Javascript
详解小程序不同页面之间通讯的解决方案
2018/11/23 Javascript
使用TS来编写express服务器的方法步骤
2020/10/29 Javascript
在nuxt中使用路由重定向的实例
2020/11/06 Javascript
Python实现保证只能运行一个脚本实例
2015/06/24 Python
python操作excel的方法
2018/08/16 Python
Python使用numpy模块实现矩阵和列表的连接操作方法
2019/06/26 Python
使用OpenCV获取图像某点的颜色值,并设置某点的颜色
2020/06/02 Python
CSS3+font字体文件实现圆形半透明菜单具体步骤(图解)
2013/06/03 HTML / CSS
开发人员所需要知道的HTML5性能分析面面观
2012/07/05 HTML / CSS
用HTML5制作数字时钟的教程
2015/05/11 HTML / CSS
The Hut英国:英国领先的豪华在线百货商店
2019/07/26 全球购物
意大利折扣和优惠券网站:Groupalia
2019/10/09 全球购物
俄罗斯便宜的在线服装商店:GroupPrice
2020/04/10 全球购物
估算杭州有多少软件工程师
2015/08/11 面试题
运动会广播稿诗歌版
2014/09/12 职场文书
正风肃纪查摆剖析材料
2014/10/10 职场文书
基石观后感
2015/06/12 职场文书
2016大学优秀学生干部事迹材料
2016/03/01 职场文书
Python 如何解决稀疏矩阵运算
2021/05/26 Python
利用nginx搭建RTMP视频点播、直播、HLS服务器
2022/05/25 Servers