jQuery实现隔行背景色变色


Posted in Javascript onNovember 24, 2014

隔行变色有很多中方法来实现,之前我都是直接将判断代码写在程序中,今天我们来使用jQuery实现,代码奉上~

jQuery代码:

       $(function(){ 

            var item = $("tr"); 

            for(var i=0;i<item.length;i++){ 

                if(i%2==0){ 

                    item[i].style.backgroundColor="#888"; 

                } 

            } 

            //$("#tb tbody tr:even").css("backgroundColor","#888"); 

  

        });

HTML代码:

    <table id='tb'> 

        <tbody> 

            <tr><td>第一行</td><td>第一行</td></tr> 

            <tr><td>第二行</td><td>第2行</td></tr> 

            <tr><td>第三行</td><td>第3行</td></tr> 

            <tr><td>第4行</td><td>第4行</td></tr> 

            <tr><td>第5行</td><td>第5行</td></tr> 

            <tr><td>第6行</td><td>第6行</td></tr> 

        </tbody> 

    </table>

是不是很好玩,小伙伴们其实可以用jQuery实现很多好玩的东西的,大家自由发挥吧

Javascript 相关文章推荐
prototype 源码中文说明之 prototype.js
Sep 22 Javascript
建立良好体验度的Web注册系统ajax
Jul 09 Javascript
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别
Oct 18 Javascript
jquery异步跨域访问代码
Jun 28 Javascript
js实现点击后将文字或图片复制到剪贴板的方法
Aug 04 Javascript
javascript中几个容易混淆的概念总结
Apr 14 Javascript
基于jQuery实现的QQ表情插件
Aug 25 Javascript
深入浅析jQuery对象$.html
Aug 22 Javascript
微信小程序开发之从相册获取图片 使用相机拍照 本地图片上传
Apr 18 Javascript
Node接收电子邮件的实例代码
Jul 21 Javascript
layui 数据表格复选框实现单选功能的例子
Sep 19 Javascript
在Vue中使用this.$store或者是$route一直报错的解决
Nov 08 Javascript
jQuery实现统计复选框选中数量
Nov 24 #Javascript
基于jQuery实现文本框缩放以及上下移动功能
Nov 24 #Javascript
基于jQuery实现复选框的全选 全不选 反选功能
Nov 24 #Javascript
基于jQuery实现下拉框
Nov 24 #Javascript
基于jQuery实现表单提交验证
Nov 24 #Javascript
jQuery简单实现网页选项卡特效
Nov 24 #Javascript
jQuery选择器全集详解
Nov 24 #Javascript
You might like
攻克CakePHP系列三 表单数据增删改
2008/10/22 PHP
php 自写函数代码 获取关键字 去超链接
2010/02/08 PHP
php 时间time与日期date之间的使用详解及区别
2016/11/07 PHP
PHP __call()方法实现委托示例
2019/05/20 PHP
日期 时间js控件
2009/05/07 Javascript
一些经常会用到的Javascript检测函数
2010/05/31 Javascript
jQuery.Autocomplete实现自动完成功能(详解)
2010/07/13 Javascript
原生Js页面滚动延迟加载图片实现原理及过程
2013/06/24 Javascript
基于jquery扩展漂亮的下拉框可以二次修改
2013/11/19 Javascript
javascript实现根据3原色制作颜色选择器的方法
2015/07/17 Javascript
JS+CSS实现闪烁字体效果代码
2016/04/05 Javascript
jquery表格datatables实例解析 直接加载和延迟加载
2016/08/12 Javascript
手机浏览器 后退按钮强制刷新页面方法总结
2016/10/09 Javascript
vue+vux实现移动端文件上传样式
2017/07/28 Javascript
JS基于贪心算法解决背包问题示例
2017/11/27 Javascript
Vue 父子组件数据传递的四种方式( inheritAttrs + $attrs + $listeners)
2018/05/04 Javascript
vue中导出Excel表格的实现代码
2018/10/18 Javascript
Vue实例的对象参数options的几个常用选项详解
2019/11/08 Javascript
Python编程实现的图片识别功能示例
2017/08/03 Python
利用pandas读取中文数据集的方法
2018/07/25 Python
对pandas数据判断是否为NaN值的方法详解
2018/11/06 Python
对python 中class与变量的使用方法详解
2019/06/26 Python
python实现H2O中的随机森林算法介绍及其项目实战
2019/08/29 Python
python 制作网站小说下载器
2021/02/20 Python
倩碧美国官网:Clinique美国
2016/07/20 全球购物
Snapfish英国:在线照片打印和个性化照片礼品
2017/01/13 全球购物
美国护肤咨询及美容产品电商:Askderm
2017/02/24 全球购物
什么是"引用"?申明和使用"引用"要注意哪些问题?
2016/03/03 面试题
大课间体育活动方案
2014/03/12 职场文书
班级文化建设标语
2014/06/23 职场文书
保密工作目标责任书
2014/07/28 职场文书
新郎新娘答谢词
2015/01/04 职场文书
英文道歉信
2015/01/20 职场文书
2015年信息技术教研组工作总结
2015/07/22 职场文书
《弟子规》读后感:知廉耻、明是非、懂荣辱、辨善恶
2019/12/03 职场文书
MySQL 使用事件(Events)完成计划任务
2021/05/24 MySQL