表格奇偶行设置不同颜色的核心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 相关文章推荐
根据分辩率调用不同的CSS.
Jan 08 Javascript
node.js中的socket.io的广播消息
Dec 15 Javascript
Jquery常用的方法汇总
Sep 01 Javascript
JavaScript中清空数组的方法总结
Dec 02 Javascript
JavaScript中for循环的几种写法与效率总结
Feb 03 Javascript
微信小程序 sha1 实现密码加密实例详解
Jul 06 Javascript
原生JS实现Ajax跨域请求flask响应内容
Oct 24 Javascript
微信开发之企业付款到银行卡接口开发的示例代码
Sep 18 Javascript
webpack + vue 打包生成公共配置文件(域名) 方便动态修改
Aug 29 Javascript
vue-resourc发起异步请求的方法
Feb 11 Javascript
vue 实现click同时传入事件对象和自定义参数
Jan 29 Vue.js
vue-router路由懒加载及实现的3种方式
Feb 28 Vue.js
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调用数据库的存贮过程!
2006/10/09 PHP
PHP实现网上点歌(二)
2006/10/09 PHP
深入PHP异步执行的详解
2013/06/03 PHP
Laravel 对某一列进行筛选然后求和sum()的例子
2019/10/10 PHP
jquery的ajax请求全面了解
2013/03/20 Javascript
javascript获取select的当前值示例代码(兼容IE/Firefox/Opera/Chrome)
2013/12/17 Javascript
js传中文参数controller里获取参数乱码问题解决方法
2014/01/03 Javascript
js判断ie版本号的简单实现代码
2014/03/05 Javascript
jquery实现带缩略图的可定制高度画廊效果(5种)
2015/08/28 Javascript
JavaScript File API文件上传预览
2016/02/02 Javascript
jQuery自定义图片上传插件实例代码
2017/04/04 jQuery
js数组常用最重要的方法
2018/02/04 Javascript
JS中实现浅拷贝和深拷贝的代码详解
2019/06/05 Javascript
详解ES6 CLASS在微信小程序中的应用实例
2020/04/24 Javascript
Python datetime时间格式化去掉前导0
2014/07/31 Python
python实现斐波那契递归函数的方法
2014/09/08 Python
Python基于pygame实现图片代替鼠标移动效果
2015/11/11 Python
详解Python中的文件操作
2016/08/28 Python
Python使用re模块实现信息筛选的方法
2018/04/29 Python
运用Python的webbrowser实现定时打开特定网页
2019/02/21 Python
Python如何获取Win7,Win10系统缩放大小
2020/01/10 Python
python 如何读、写、解析CSV文件
2021/03/03 Python
2013年办公室秘书的个人自我鉴定
2013/10/24 职场文书
优秀毕业生推荐信
2013/11/02 职场文书
电子信息专业学生自荐信
2013/11/09 职场文书
小学教学随笔感言
2014/02/26 职场文书
开工典礼策划方案
2014/05/23 职场文书
小学雷锋月活动总结
2014/07/03 职场文书
学校党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
2014年党风建设工作总结
2014/11/19 职场文书
2014年财务经理工作总结
2014/12/08 职场文书
《猴王出世》教学反思
2016/02/23 职场文书
html+css 实现简易导航栏功能
2021/04/07 HTML / CSS
Golang表示枚举类型的详细讲解
2021/09/04 Golang
前端实现滑动按钮AJAX与后端交互的示例代码
2022/02/24 Javascript
SQL Server数据库备份和恢复数据库的全过程
2022/06/14 SQL Server