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 相关文章推荐
js中几种去掉字串左右空格的方法
Dec 25 Javascript
jQuery对象数据缓存Cache原理及jQuery.data方法区别介绍
Apr 07 Javascript
jquery获取复选框被选中的值
Apr 10 Javascript
js中各种类型的变量在if条件中是true还是false
Jul 16 Javascript
实例代码详解javascript实现窗口抖动及qq窗口抖动
Jan 04 Javascript
BootStrap智能表单实战系列(六)表单编辑页面的数据绑定
Jun 13 Javascript
Bootstrapvalidator校验、校验清除重置的实现代码(推荐)
Sep 28 Javascript
移动端点击态处理的三种实现方式
Jan 12 Javascript
jQuery使用ajax_动力节点Java学院整理
Jul 05 jQuery
JavaScript中字符串的常用操作方法及特殊字符
Mar 18 Javascript
vue做移动端适配最佳解决方案(亲测有效)
Sep 04 Javascript
Js代码中的span拼接问题解决
Nov 22 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
destoon供应信息title调用出公司名称的方法
2014/08/22 PHP
提高网站信任度的技巧
2008/10/17 Javascript
深入理解JavaScript系列(4) 立即调用的函数表达式
2012/01/15 Javascript
来自国外的30个基于jquery的Web下拉菜单
2012/06/22 Javascript
多引号嵌套的变量命名的问题
2014/05/09 Javascript
基于jQuery实现文本框缩放以及上下移动功能
2014/11/24 Javascript
jQuery 3.0 的 setter和getter 模式详解
2016/07/11 Javascript
js获取上传文件的绝对路径实现方法
2016/08/02 Javascript
JavaScript String(字符串)对象的简单实例(推荐)
2016/08/31 Javascript
浅谈Node.js:fs文件系统模块
2016/12/08 Javascript
Bootstrap导航条鼠标悬停下拉菜单
2017/01/04 Javascript
jQuery实现手势解锁密码特效
2017/08/14 jQuery
jQuery实现点击下拉框中的值累加到文本框中的方法示例
2017/10/28 jQuery
微信小程序实现图片压缩功能
2018/01/26 Javascript
JavaScript实现的反序列化json字符串操作示例
2018/07/18 Javascript
angular 服务的单例模式(依赖注入模式下)详解
2018/10/22 Javascript
Javascript通过控制类名更改样式
2019/05/24 Javascript
Vue使用vue-recoure + http-proxy-middleware + vuex配合promise实现基本的跨域请求封装
2019/10/21 Javascript
Python时区设置方法与pytz查询时区教程
2013/11/27 Python
python实现从一组颜色中找出与给定颜色最接近颜色的方法
2015/03/19 Python
python之Character string(实例讲解)
2017/09/25 Python
对python制作自己的数据集实例讲解
2018/12/12 Python
Python利用WMI实现ping命令的例子
2019/08/14 Python
Python使用itchat模块实现简单的微信控制电脑功能示例
2019/08/26 Python
python列表插入append(), extend(), insert()用法详解
2019/09/14 Python
使用OpenCV获取图像某点的颜色值,并设置某点的颜色
2020/06/02 Python
python能做哪方面的工作
2020/06/15 Python
记录模型训练时loss值的变化情况
2020/06/16 Python
python如何从键盘获取输入实例
2020/06/18 Python
Abbott Lyon官网:女士手表、珠宝及配件
2020/12/26 全球购物
线程的基本概念、线程的基本状态以及状态之间的关系
2012/10/26 面试题
delegate与普通函数的区别
2014/01/22 面试题
室内趣味活动方案
2014/08/24 职场文书
初一军训感言
2015/08/01 职场文书
珍惜时间的诗歌赏析
2019/08/23 职场文书
详细聊聊浏览器是如何看闭包的
2021/11/11 Javascript