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 相关文章推荐
script的async属性以非阻塞的模式加载脚本
Jan 15 Javascript
JavaScript实现将数组数据添加到Select下拉框的方法
Aug 21 Javascript
JavaScript实现水平进度条拖拽效果
Jan 18 Javascript
JS使用ActiveXObject实现用户提交表单时屏蔽敏感词功能
Jun 20 Javascript
js基于FileSaver.js 浏览器导出Excel文件的示例
Aug 15 Javascript
js实现登录与注册界面
Nov 01 Javascript
react-router 路由切换动画的实现示例
Dec 03 Javascript
详解关于JSON.parse()和JSON.stringify()的性能小测试
Mar 14 Javascript
解决layui使用layui-icon出现默认图标的问题
Sep 11 Javascript
解决echarts图表使用v-show控制图表显示不全的问题
Jul 19 Javascript
javascript实现简单页面倒计时
Mar 02 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 HtmlReplace输入过滤安全函数
2010/07/03 PHP
10个超级有用值得收藏的PHP代码片段
2015/01/22 PHP
php+mysqli预处理技术实现添加、修改及删除多条数据的方法
2015/01/30 PHP
php显示时间常用方法小结
2015/06/05 PHP
PHP 二维数组和三维数组的过滤
2016/03/16 PHP
php curl批处理实现可控并发异步操作示例
2018/05/09 PHP
PHP cookie,session的使用与用户自动登录功能实现方法分析
2019/06/05 PHP
javascript在一段文字中的光标处插入其他文字
2007/08/26 Javascript
js程序中美元符号$是什么
2008/06/05 Javascript
解决IE6的PNG透明JS插件使用介绍
2013/04/17 Javascript
如何从jQuery的ajax请求中删除X-Requested-With
2013/12/11 Javascript
快速解决jquery之get缓存问题的最简单方法介绍
2013/12/19 Javascript
JavaScript异步回调的Promise模式封装实例
2014/06/07 Javascript
jQuery中[attribute*=value]选择器用法实例
2014/12/31 Javascript
JavaScript判断IE版本型号
2015/07/27 Javascript
jQuery 限制输入字符串长度
2016/06/20 Javascript
JS正则替换掉小括号及内容的方法
2016/11/29 Javascript
php中and 和 &amp;&amp;出坑指南
2018/07/13 Javascript
详解vue项目中使用token的身份验证的简单实践
2019/03/08 Javascript
Vue中的组件及路由使用实例代码详解
2019/05/22 Javascript
微信小程序如何实现全局重新加载
2019/06/05 Javascript
微信小程序实现图片翻转效果的实例代码
2019/09/20 Javascript
原生JS实现记忆翻牌游戏
2020/07/31 Javascript
Python中用Decorator来简化元编程的教程
2015/04/13 Python
python写入中英文字符串到文件的方法
2015/05/06 Python
python搭建微信公众平台
2016/02/09 Python
django 取消csrf限制的实例
2020/03/13 Python
HTML5响应式(自适应)网页设计的实现
2017/11/17 HTML / CSS
来自Ocado的宠物商店:Fetch
2018/07/10 全球购物
俄罗斯在线服装店:STOLNIK
2021/03/07 全球购物
速卖通欧盟:Aliexpress EU
2020/08/19 全球购物
日期和时间问题
2015/01/04 面试题
幼儿园中班教师寄语
2014/04/03 职场文书
门卫岗位职责说明书
2014/08/18 职场文书
农村环境卫生倡议书
2015/04/29 职场文书
2016党性教育学习心得体会
2016/01/21 职场文书