js控制表单奇偶行样式的简单方法


Posted in Javascript onJuly 31, 2013

一、如果使用JQuery的话可以直接JQuery的

$("tr:odd").addClass("clazzName");

$("tr:even").addClass("clazzName");

二、如果是使用纯js的话

1.先获取table标签,var table = document.getElementById()

2.再获取里面的tbody标签var tbody = table.getElementsByTagName("tbody")[0]

3.再获取tr标签var trs = tbody.getElementsByTagName("tr")

4.然后迭代trs

for(var i=0; i

if(i%2==0){

trs[i].style.backgroundColor="red";

}else{

trs[i].style.backgroundColor="blue";

}

}

获取tbody标签是必须的,虽然你没写,但是浏览器在编译table的时候会自动给加上

所有的tr标签都是在tbody里面的

Javascript 相关文章推荐
js不完美解决click和dblclick事件冲突问题
Jul 16 Javascript
JavaScript实现从数组中选出和等于固定值的n个数
Sep 03 Javascript
node.js使用require()函数加载模块
Nov 26 Javascript
jQuery实现新消息在网页标题闪烁提示
Jun 23 Javascript
javascript解决小数的加减乘除精度丢失的方案
May 31 Javascript
js字符串引用的两种方式(必看)
Sep 18 Javascript
AngularJS指令与指令之间的交互功能示例
Dec 14 Javascript
jQuery实现点击自身以外区域关闭弹出层功能完整示例【改进版】
Jul 31 jQuery
浅谈微信小程序flex布局基础
Sep 10 Javascript
使用webpack构建应用的方法步骤
Mar 04 Javascript
在Web关闭页面时发送Ajax请求的实现方法
Mar 07 Javascript
javascript使用正则表达式实现注册登入校验
Sep 23 Javascript
js中parseInt函数浅谈
Jul 31 #Javascript
JavaScript中的关键字"VAR"使用详解 分享
Jul 31 #Javascript
JavaScript 和 Java 的区别浅析
Jul 31 #Javascript
javascript检查表单数据是否改变的方法
Jul 30 #Javascript
JS 对输入框进行限制(常用的都有)
Jul 30 #Javascript
JS无限极树形菜单,json格式、数组格式通用示例
Jul 30 #Javascript
js中widow.open()方法使用详解
Jul 30 #Javascript
You might like
php学习之运算符相关概念
2011/06/09 PHP
PHP如何利用P3P实现跨域
2013/08/24 PHP
php阿拉伯数字转中文人民币大写
2015/12/21 PHP
PHP的Yii框架中创建视图和渲染视图的方法详解
2016/03/29 PHP
php实现查询功能(数据访问)
2017/05/23 PHP
php微信开发之音乐回复功能
2018/06/14 PHP
yii框架使用分页的方法分析
2019/07/25 PHP
php实现文件上传基本验证
2020/03/04 PHP
Javascript自定义排序 node运行 实例
2013/06/05 Javascript
JavaScript中setMonth()方法的使用详解
2015/06/11 Javascript
canvas实现粒子时钟效果
2017/02/06 Javascript
JS实现的二叉树算法完整实例
2017/04/06 Javascript
JS实现简单抖动效果
2017/06/01 Javascript
详解nodejs通过代理(proxy)发送http请求(request)
2017/09/22 NodeJs
NodeJS实现视频转码的示例代码
2017/11/18 NodeJs
Angular实现的敏感文字自动过滤与提示功能示例
2017/12/29 Javascript
浅谈vuejs实现数据驱动视图原理
2018/02/23 Javascript
微信小程序实现漂亮的弹窗效果
2020/05/26 Javascript
Vue中对iframe实现keep alive无刷新的方法
2019/07/23 Javascript
javascript实现异形滚动轮播
2019/11/28 Javascript
element-ui点击查看大图的方法示例
2020/12/14 Javascript
[15:41]教你分分钟做大人——灰烬之灵
2015/03/11 DOTA
Python list与NumPy array 区分详解
2019/11/06 Python
python GUI库图形界面开发之PyQt5工具栏控件QToolBar的详细使用方法与实例
2020/02/28 Python
Python collections.defaultdict模块用法详解
2020/06/18 Python
HTML5 贪吃蛇游戏实现思路及源代码
2013/09/03 HTML / CSS
极简的HTML5模版
2015/07/09 HTML / CSS
详解canvas多边形(蜘蛛图)的画法示例
2018/01/29 HTML / CSS
英国手机壳购买网站:Case Hut
2019/04/11 全球购物
一些Unix笔试题和面试题
2012/09/25 面试题
高中班长自我鉴定
2013/12/20 职场文书
安全教育心得体会
2013/12/29 职场文书
单位一把手群众路线四风问题整改措施
2014/09/25 职场文书
微观世界观后感
2015/06/10 职场文书
2015年计算机教师工作总结
2015/07/22 职场文书
你对自己的信用报告有过了解吗?
2019/07/09 职场文书