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 相关文章推荐
JQuery触发事件例如click
Sep 11 Javascript
javascript实现页面内关键词高亮显示代码
Apr 03 Javascript
多引号嵌套的变量命名的问题
May 09 Javascript
jquery中post方法用法实例
Oct 21 Javascript
jQuery插件slider实现拖动滑块选取价格范围
Apr 30 Javascript
jquery pagination插件动态分页实例(Bootstrap分页)
Dec 23 Javascript
JS实现加载时锁定HTML页面元素的方法
Jun 24 Javascript
Node.js学习教程之HTTP/2服务器推送【译】
Oct 31 Javascript
Vue全局分页组件的实现代码
Aug 10 Javascript
使用p5.js实现动态GIF图片临摹重现
Oct 23 Javascript
JS数据类型判断的几种常用方法
Jul 07 Javascript
vue-cli+webpack项目打包到服务器后,ttf字体找不到的解决操作
Aug 28 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 高手之路(二)
2006/10/09 PHP
php 使用post,get的一种简洁方式
2010/04/25 PHP
php 常用类汇总 推荐收藏
2010/05/13 PHP
PHP网站备份程序代码分享
2011/06/10 PHP
PHP中session变量的销毁
2014/02/27 PHP
php中文字符串截取方法实例总结
2014/09/30 PHP
PHP的cookie与session原理及用法详解
2019/09/27 PHP
javascript事件问题
2009/09/05 Javascript
JS setCapture 区域外事件捕捉
2010/03/18 Javascript
基于JQuery.timer插件实现一个计时器
2010/04/25 Javascript
javascript hasFocus使用实例
2010/06/29 Javascript
javascript数组去重方法终极总结
2014/06/05 Javascript
bootstrap table 服务器端分页例子分享
2015/02/10 Javascript
JS实现点击复选框将按钮或文本框变为灰色不可用的方法
2015/08/11 Javascript
浅谈JavaScript超时调用和间歇调用
2015/08/30 Javascript
JavaScript中instanceof运算符的使用示例
2016/06/08 Javascript
js实现省份下拉菜单效果
2017/02/15 Javascript
关于vue v-for循环解决img标签的src动态绑定问题
2018/09/18 Javascript
微信小程序自定义组件实现环形进度条
2020/11/17 Javascript
echarts实现晶体球面投影的实例教程
2020/10/10 Javascript
python和C语言混合编程实例
2014/06/04 Python
详解在Python程序中使用Cookie的教程
2015/04/30 Python
Python matplotlib画图实例之绘制拥有彩条的图表
2017/12/28 Python
用tensorflow搭建CNN的方法
2018/03/05 Python
python 列表递归求和、计数、求最大元素的实例
2018/11/28 Python
对python中的argv和argc使用详解
2018/12/15 Python
浅谈Python大神都是这样处理XML文件的
2019/05/31 Python
Django 对IP访问频率进行限制的例子
2019/08/30 Python
Python字符串中添加、插入特定字符的方法
2019/09/10 Python
Pytorch Tensor的统计属性实例讲解
2019/12/30 Python
基于pytorch padding=SAME的解决方式
2020/02/18 Python
keras 多gpu并行运行案例
2020/06/10 Python
网络编辑岗位职责范本
2014/02/10 职场文书
法院干警四风问题个人对照检查材料思想汇报
2014/10/07 职场文书
2015年体育部工作总结
2015/04/02 职场文书
民事起诉书范本
2015/05/19 职场文书