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 相关文章推荐
复制小说文本时出现的随机乱码的去除方法
Sep 07 Javascript
JS多物体 任意值 链式 缓冲运动
Aug 10 Javascript
js中for in语句的用法讲解
Apr 24 Javascript
jquery制作图片时钟特效
Mar 30 Javascript
JS中setTimeout的巧妙用法前端函数节流
Mar 24 Javascript
vue组件实例解析
Jan 10 Javascript
解决Angular2 router.navigate刷新页面的问题
Aug 31 Javascript
JS监听组合按键思路及实现过程
Apr 17 Javascript
JS实现手写 forEach算法示例
Apr 29 Javascript
小程序瀑布流组件实现翻页与图片懒加载
May 19 Javascript
微信小程序用户盒子、宫格列表的实现
Jul 01 Javascript
vue-i18n实现中英文切换的方法
Jul 06 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
Drupal简体中文语言包安装教程
2014/09/27 PHP
浅谈php和.net的区别
2014/09/28 PHP
php提交post数组参数实例分析
2015/12/17 PHP
详解PHP swoole process的使用方法
2017/08/26 PHP
php-fpm重启导致的程序执行中断问题详解
2019/04/29 PHP
thinkphp5框架实现的自定义扩展类操作示例
2019/05/16 PHP
jquery中对表单的基本操作代码
2010/07/29 Javascript
extjs实现选择多表自定义查询功能 前台部分(ext源码)
2011/12/20 Javascript
input链接页面、打开新网页等等的具体实现
2013/12/30 Javascript
js实现的奥运倒计时时钟效果代码
2015/12/09 Javascript
AngularJs学习第八篇 过滤器filter创建
2016/06/08 Javascript
es6+angular1.X+webpack 实现按路由功能打包项目的示例
2017/08/16 Javascript
使用VUE+iView+.Net Core上传图片的方法示例
2019/01/04 Javascript
JS多个表单数据提交下的serialize()应用实例分析
2019/08/27 Javascript
html+jQuery实现拖动滑块图片拼图验证码插件【移动端适用】
2019/09/10 jQuery
Weex开发之地图篇的具体使用
2019/10/16 Javascript
webpack+vue-cil 中proxyTable配置接口地址代理操作
2020/07/18 Javascript
Vue切换Tab动态渲染组件的操作
2020/09/21 Javascript
Python多进程并发(multiprocessing)用法实例详解
2015/06/02 Python
举例讲解Python设计模式编程中对抽象工厂模式的运用
2016/03/02 Python
python中文编码与json中文输出问题详解
2018/08/24 Python
使用python进行波形及频谱绘制的方法
2019/06/17 Python
Django Admin中增加导出Excel功能过程解析
2019/09/04 Python
如何在windows下安装配置python工具Ulipad
2020/10/27 Python
北京一家公司的.net开发工程师笔试题
2012/04/17 面试题
校园安全广播稿
2014/02/08 职场文书
安全生产月活动总结
2014/05/04 职场文书
优秀党务工作者事迹材料
2014/05/07 职场文书
新品发布会策划方案
2014/06/08 职场文书
学校党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
幼儿教师辞职信
2015/02/27 职场文书
2015年女工委工作总结
2015/07/27 职场文书
js实现上传图片到服务器
2021/04/11 Javascript
如何用 Python 子进程关闭 Excel 自动化中的弹窗
2021/05/07 Python
了解Redis常见应用场景
2021/06/23 Redis
css之clearfix的用法深入理解(必看篇)
2023/05/21 HTML / CSS