表格奇偶行设置不同颜色的核心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 相关文章推荐
页面版文本框智能提示JS代码
Nov 20 Javascript
javascript:history.go()和History.back()的区别及应用
Nov 25 Javascript
js操纵dom生成下拉列表框的方法
Feb 24 Javascript
判断访客终端类型集锦
Jun 05 Javascript
jquery实现鼠标经过显示下划线的渐变下拉菜单效果代码
Aug 24 Javascript
解决angular的$http.post()提交数据时后台接收不到参数值问题的方法
Dec 10 Javascript
简单的分页代码js实现
May 17 Javascript
Vue2.0利用 v-model 实现组件props双向绑定的优美解决方案
Mar 13 Javascript
vue.js实现标签页切换效果
Jun 07 Javascript
vue项目每30秒刷新1次接口的实现方法
Dec 04 Javascript
从零撸一个pc端vue的ui组件库( 计数器组件 )
Aug 08 Javascript
写一个Vue loading 插件
Nov 09 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编程效率的方法
2013/11/07 PHP
php集成环境xampp中apache无法启动问题解决方案
2014/11/18 PHP
cakephp打印sql语句的方法
2015/02/13 PHP
PHP Include文件实例讲解
2019/02/15 PHP
jQuery autocomplete插件修改
2009/04/17 Javascript
jquery中邮箱地址 URL网站地址正则验证实例代码
2013/09/15 Javascript
jQuery 动态云标签插件
2014/11/11 Javascript
JavaScript使用setInterval()函数实现简单轮询操作的方法
2015/02/02 Javascript
js事件监听器用法实例详解
2015/06/01 Javascript
javascript实现tab切换特效
2015/11/12 Javascript
javascript入门教程基础篇
2015/11/16 Javascript
javascript随机抽取0-100之间不重复的10个数
2016/02/25 Javascript
jQuery使用zTree插件实现树形菜单和异步加载
2016/02/25 Javascript
js从外部获取图片的实现方法
2016/08/05 Javascript
最好用的Bootstrap fileinput.js文件上传组件
2016/12/12 Javascript
JS实现搜索框文字可删除功能
2016/12/28 Javascript
JS原生数据双向绑定实现代码
2017/08/14 Javascript
iframe与主框架跨域相互访问实现方法
2017/09/14 Javascript
js调用设备摄像头的方法
2018/07/19 Javascript
解决Vue中的生命周期beforeDestory不触发的问题
2020/07/21 Javascript
Hadoop中的Python框架的使用指南
2015/04/22 Python
学习python之编写简单乘法口诀表实现代码
2016/02/27 Python
Django restful framework生成API文档过程详解
2020/11/12 Python
python调用jenkinsAPI构建jenkins,并传递参数的示例
2020/12/09 Python
Manduka官网:瑜伽垫、瑜伽毛巾和服装
2018/07/02 全球购物
英国电气世界:Electrical World
2019/09/08 全球购物
大学生自我鉴定评语
2014/01/27 职场文书
文秘人员工作职责
2014/01/31 职场文书
绿色家庭事迹材料
2014/05/01 职场文书
纪念九一八事变83周年国旗下讲话稿
2014/09/15 职场文书
单位委托书格式范本
2014/09/29 职场文书
公司辞职信模板
2015/05/13 职场文书
大学生受助感言
2015/08/01 职场文书
《小蝌蚪找妈妈》教学反思
2016/02/23 职场文书
关于考试抄袭的检讨书
2019/11/02 职场文书
MySQL快速插入一亿测试数据
2021/06/23 MySQL