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 相关文章推荐
JQuery 国际象棋棋盘 实现代码
Jun 26 Javascript
javascript for循环设法提高性能
Feb 24 Javascript
jquery获取input表单值的代码
Apr 19 Javascript
动态加载图片路径 保持JavaScript控件的相对独立性
Sep 06 Javascript
jquery遍历table的tr获取td的值实现方法
May 19 Javascript
JavaScript 数组的深度复制解析
Nov 02 Javascript
折叠菜单及选择器的运用
Feb 03 Javascript
JS获取当前地理位置的方法
Oct 25 Javascript
JavaScript canvas实现围绕旋转动画
Nov 18 Javascript
Vue工程模板文件 webpack打包配置方法
Dec 26 Javascript
原来JS还可以这样拆箱转换详解
Feb 01 Javascript
Vue中的nextTick作用和几个简单的使用场景
Jan 25 Vue.js
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集成FCK的函数代码
2008/09/27 PHP
php 使用post,get的一种简洁方式
2010/04/25 PHP
PHP中文竖排转换实现方法
2015/10/23 PHP
Yii框架表单模型和验证用法
2016/05/20 PHP
PHP有序表查找之插值查找算法示例
2018/02/10 PHP
PHP排序算法之归并排序(Merging Sort)实例详解
2018/04/21 PHP
用jQuery实现检测浏览器及版本的脚本代码
2008/01/22 Javascript
分享一款基于jQuery的视频播放插件
2014/10/09 Javascript
使用JQ来编写最基本的淡入淡出效果附演示动画
2014/10/31 Javascript
angularjs的一些优化小技巧
2014/12/06 Javascript
DOM节点的替换或修改函数replaceChild()用法实例
2015/01/12 Javascript
this,this,再次讨论javascript中的this,超全面(经典)
2016/01/05 Javascript
使用jQuery加载html页面到指定的div实现方法
2016/07/13 Javascript
微信jssdk用法汇总
2016/07/16 Javascript
input file上传 图片预览功能实例代码
2016/10/25 Javascript
jq给页面添加覆盖层遮罩的实例
2017/02/16 Javascript
AngularJS之ionic 框架下实现 Localstorage本地存储
2017/04/22 Javascript
jQuery常见面试题之DOM操作详析
2017/07/05 jQuery
Angular5给组件本身的标签添加样式class的方法
2018/04/07 Javascript
用Node编写RESTful API接口的示例代码
2018/07/04 Javascript
JavaScript实现单图片上传并预览功能
2019/09/30 Javascript
C#返回当前系统所有可用驱动器符号的方法
2015/04/18 Python
python中从str中提取元素到list以及将list转换为str的方法
2018/06/26 Python
TensorFlow用expand_dim()来增加维度的方法
2018/07/26 Python
Python实现企业微信机器人每天定时发消息实例
2020/02/25 Python
PyQt5 文本输入框自动补全QLineEdit的实现示例
2020/05/13 Python
欧洲顶级的童装奢侈品购物网站:Bambini Fashion(面向全球)
2018/04/24 全球购物
意大利运动服减价商店:ScontoSport
2020/03/10 全球购物
心理健康日活动总结
2014/05/08 职场文书
化工专业求职信
2014/07/01 职场文书
先进个人自荐书
2015/03/06 职场文书
2015教师年度思想工作总结
2015/04/30 职场文书
小学数学教师研修感悟
2015/11/18 职场文书
创业计划书之美容店
2019/09/16 职场文书
php7中停止php-fpm服务的方法详解
2021/05/09 PHP
【海涛dota解说】海涛小满开黑4v5被破两路翻盘潮汐第一视角解说
2022/04/01 DOTA