<!DOCTYPE html>

 <html>

 <head lang="en">

     <meta charset="UTF-8">

     <title>隔行换色</title>

     <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>

     <script type="text/javascript">

         $(document).ready(function(){

             $("tr:even").not(":first").css("background","#eee");

         });

         /*

         window.onload = function() {

             var rows = document.getElementsByTagName("tr");

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

                 if (i % 2 == 0 && i != 0)

                     rows[i].style.backgroundColor = "#eee";

             }

         };

         */

     </script>

 </head>

 <body>

 <table id="orders">

     <thead >

         <tr style="background-color: #aaaaaa;">

             <th>序号</th>

             <th>订单号</th>

             <th>商品名称</th>

             <th>价格(元)</th>

         </tr>

     </thead>

     <tr>

         <td>1</td>

         <td>10035900</td>

         <td>Nike透气减震运动鞋</td>

         <td>231.00</td>

     </tr>

     <tr>

         <td>2</td>

         <td>10036114</td>

         <td>天美太阳伞</td>

         <td>51.00</td>

     </tr>

     <tr>

         <td>3</td>

         <td>10035110</td>

         <td>万圣节儿童蜘蛛侠装</td>

         <td>31.00</td>

     </tr>

     <tr>

         <td>4</td>

         <td>10032900</td>

         <td>jQuery权威指南</td>

         <td>22.50</td>

     </tr>

 </table>

 </body>

 </html>

jQuery的隔行换色的更多相关文章

  1. jQuery的基本过滤器与jQuery实现隔行换色实例

    没加过滤器之前: 加过滤器之后: 总的代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8& ...

  2. JQuery 表格 隔行换色 和鼠标滑过的样式

    $(document).ready(function () { $(".Pub_TB tbody tr:even td").css("background-color&q ...

  3. jQuery表格隔行换色和全选的实现

    1.下载jQuery,并导入:https://blog.csdn.net/weixin_44718300/article/details/88746796 2.代码实现: <!DOCTYPE h ...

  4. jQuery实现表格隔行换色且感应鼠标高亮行变色

    jQuery插件实现表格隔行换色且感应鼠标高亮行变色 http://www.jb51.net/article/41568.htm jquery 操作DOM的基本用法分享http://www.jb51. ...

  5. JQuery案例一：实现表格隔行换色

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. jQuery应用实例2：表格隔行换色

    这里是用JS实现的:http://www.cnblogs.com/xuyiqing/p/8376312.html 接下来利用上一篇提到的选择器利用jQuery实现: 发现原来多行代码这里只需要两行: ...

  7. jQuery插件实现表格隔行换色且感应鼠标高亮行变色

    实现表格隔行换色,且感应鼠标行变色的方法有很多,在本文将为大家介绍的是使用jQuery插件来实现,具体如下 看代码: : css代码:  

  8. jQuery学习(四)——使用JQ完成表格隔行换色

    1.步骤分析: 第一步:引入jquery的类库 第二步:直接写页面加载函数 第三步:直接使用jquery的选择器(组合选择)拿到需要操作的元素(奇数行和偶数行) 第四步:分别使用CSS的方法(css( ...

  9. JQuery的使用案例（二级联动，隔行换色，轮播图，广告插入）

    JQuery的使用案例 (一)利用JQuery完成省市二级联动 第一步:确定事件(change事件),在绑定的函数里面获取用户选择的省份 第二步:创建二维数组来存储省份和城市 第三步:遍历二维数组中的 ...

随机推荐

  1. PHP里的进制

    1.进制转换函数: <?php function decto_bin($datalist,$bin) { static $arr=array(0,1,2,3,4,5,6,7,8,9,'A','B ...

  2. centos7 搭建svn服务

    linux(centos)下SVN服务器如何搭建?说到SVN服务器,想必大家都知道,可以是在LINUX下如何搭建SVN服务器呢?那么今天给大家分享一下linux(centos)搭建SVN服务器的思路! ...

  3. 利率计算v2.0--web版--软件工程

    .客户说:帮我开发一个复利计算软件. .如果按照单利计算,本息又是多少呢? .假如30年之后要筹措到300万元的养老金,平均的年回报率是3%,那么,现在必须投入的本金是多少呢? .利率这么低,复利计算 ...

  4. WEB开发常见错误-php无法操作数据库

    Ubuntu 安装phpmyadmin 和配置   ubuntu 安装 phpmyadmin  两种 : 1: apt-get 安装  然后使用 已有的虚拟主机目录建立软连接  sudo  apt-g ...

  5. Problem of Uninstall Cloudera: Cannot Add Hdfs and Reported Cannot Find CDH's bigtop-detect-javahome

    1. Problem We wrote a shell script to uninstall Cloudera Manager(CM) that run in a cluster with 3 li ...

  6. FTP服务器的搭建与安全配置

    FTP可以说是Internet上使用非常广泛的一种通讯协议了.它工作在OSI模型的第7层,是TCP/IP的一种具体应用.FTP采用基于TCP的可靠连接:监听21端口来等待控制连接请求,当连接建立后,采 ...

  7. 机器学习—SVM

    一.原理部分: 依然是图片~ 二.sklearn实现: import pandas as pd import numpy as np import matplotlib.pyplot as plt i ...

  8. D3 datum()

    datum()和data()功能类似. datum():将指定数据赋值给被选择元素.data():将数据数组与选择集的元素结合. var p = d3.selectAll('p'); p.datum( ...

  9. Spring 框架简介

    Spring 是一个开源框架,是为了解决企业应用程序开发复杂性而创建的.框架的主要优势之一就是其分层架构,分层架构允许您选择使用哪一个组件,同时为 J2EE 应用程序开发提供集成的框架. 在这篇由三部 ...

  10. Android-Activity启动模式(launchMode)

    Activity启动模式是非常重要的一块内容,启动模式直接关系到用户的体验 和 性能的提升等 Activity启动模式分为四种: 如果不配置:launchMode,默认就是:standard 标准的 ...