jQuery实现隔行变色的方法分析(对比原生JS)


Posted in Javascript onNovember 18, 2016

本文实例分析了jQuery实现隔行变色的方法。分享给大家供大家参考,具体如下:

原生js:

var tab = document.getElementByTagName('table')[0];
var tr = tab.getElementByTagName('tr');
for(var i=0;i<tr.length;i++){
  if(i%2==0){
    tr[i].style.background="orange";
  }else{
    tr[i].style.background="#abcdef";
  }
}

jquery dom选择器:

$('table tr:odd').css('background','orange');
$('table tr:even').css('background','#abcdef');

jquery 方法选择器:

$('table tr').filter(':odd').css('background','orange').end().filter(':even').css('background','#abcdef');

有很多的方法 ,多学一点知识,少写一行代码。

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
Javascript操纵Cookie实现购物车程序
Feb 15 Javascript
利用google提供的API(JavaScript接口)获取网站访问者IP地理位置的代码详解
Jul 24 Javascript
遍历DOM对象内的元素属性示例代码
Feb 08 Javascript
JS中三目运算符和if else的区别分析与示例
Nov 21 Javascript
EasyUI,点击开启编辑框,并且编辑框获得焦点的方法
Mar 01 Javascript
js实现touch移动触屏滑动事件
Apr 17 Javascript
JavaScript截断字符串的方法
Jul 15 Javascript
jquery+ajax实现直接提交表单实例分析
Jun 17 Javascript
vue如何实现observer和watcher源码解析
Mar 09 Javascript
通过jquery.cookie.js实现记住用户名、密码登录功能
Jun 20 jQuery
koa2使用ejs和nunjucks作为模板引擎的使用
Nov 27 Javascript
vue插件--仿微信小程序showModel实现模态提示窗功能
Aug 19 Javascript
jQuery和JavaScript节点插入元素的方法对比
Nov 18 #Javascript
js与jquery分别实现tab标签页功能的方法
Nov 18 #Javascript
jQuery实现点击某个div打开层,点击其他div关闭层实例分析(阻止冒泡)
Nov 18 #Javascript
浅谈javascript中遇到的字符串对象处理
Nov 18 #Javascript
文件上传,iframe跨域数据提交的实现
Nov 18 #Javascript
jQuery实现自动调用和触发某个事件的方法
Nov 18 #Javascript
jQuery与JavaScript节点创建方法的对比
Nov 18 #Javascript
You might like
PHP 5.0 Pear安装方法
2006/12/06 PHP
php-perl哈希算法实现(times33哈希算法)
2013/12/30 PHP
Laravel 5框架学习之子视图和表单复用
2015/04/09 PHP
JavaScript 基础问答三
2008/12/03 Javascript
JavaScript 对象的属性和方法4种不同的类型
2010/03/19 Javascript
Js获取数组最大和最小值示例代码
2013/10/29 Javascript
javascript中的括号()用法小结
2014/04/14 Javascript
老生常谈JavaScript 函数表达式
2016/09/01 Javascript
如何用JS/HTML将时间戳转换为“xx天前”的形式
2017/02/06 Javascript
javascript 删除数组元素和清空数组的简单方法
2017/02/24 Javascript
JavaScript实现实时更新系统时间的实例代码
2017/04/04 Javascript
js字符限制(字符截取) 一个中文汉字算两个字符
2017/09/12 Javascript
微信小程序实现图片上传放大预览删除代码
2020/06/28 Javascript
javascript中数组的常用算法深入分析
2019/03/12 Javascript
js 实现 list转换成tree的方法示例(数组到树)
2019/08/18 Javascript
Vue前端判断数据对象是否为空的实例
2020/09/02 Javascript
[01:08:29]DOTA2-DPC中国联赛定级赛 RNG vs Aster BO3第一场 1月9日
2021/03/11 DOTA
python服务器与android客户端socket通信实例
2014/11/12 Python
Python的爬虫框架scrapy用21行代码写一个爬虫
2017/04/24 Python
Python对象类型及其运算方法(详解)
2017/07/05 Python
django2用iframe标签完成网页内嵌播放b站视频功能
2018/06/20 Python
Python 限制线程的最大数量的方法(Semaphore)
2019/02/22 Python
关于Python 常用获取元素 Driver 总结
2019/11/24 Python
Windows下Anaconda安装、换源与更新的方法
2020/04/17 Python
Python Sqlalchemy如何实现select for update
2020/10/12 Python
智能旅行箱:Horizn Studios
2018/04/30 全球购物
专科毕业生求职简历的自我评价
2013/10/12 职场文书
临床医师专业个人自我评价范文
2013/11/07 职场文书
三查三看党性分析材料
2014/02/18 职场文书
小学生暑假家长评语
2014/04/17 职场文书
团委书记的竞聘演讲稿
2014/04/24 职场文书
秋天的雨教学反思
2014/04/27 职场文书
作风转变年心得体会
2014/10/22 职场文书
出国留学单位推荐信
2015/03/26 职场文书
2015年售后服务工作总结
2015/04/25 职场文书
Mysql存储过程、触发器、事件调度器使用入门指南
2022/01/22 MySQL