1、Table奇数偶数行

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <title></title>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <script type="text/javascript">

 window.onload = function(){ //页面所有元素加载完毕

     var item  =  document.getElementById("tb");            //获取id为tb的元素(table)

     var tbody =  item.getElementsByTagName("tbody")[];    //获取表格的第一个tbody元素

     var trs =   tbody.getElementsByTagName("tr");            //获取tbody元素下的所有tr元素

     for(var i=;i < trs.length;i++){//循环tr元素

         if(i%==){        //取模. (取余数.比如 0%2=0 , 1%2=1 , 2%2=0 , 3%2=1)

             trs[i].style.backgroundColor = "#888"; // 改变 符合条件的tr元素 的背景色.

         }

     }

 }

 </script>

 </head>

 <body>

 <table id="tb">

     <tbody>

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

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

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

         <tr><td>第四行</td><td>第四行</td></tr>

         <tr><td>第五行</td><td>第五行</td></tr>

         <tr><td>第六行</td><td>第六行</td></tr>

     </tbody>

 </table>

 </body>

 </html>

2、CheckBox

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <title></title>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <script type="text/javascript">

 window.onload = function(){//页面所有元素加载完毕

     var btn = document.getElementById("btn");  //获取id为btn的元素(button)

     btn.onclick = function(){                   //给元素添加onclick事件

         var arrays = new Array();              //创建一个数组对象

         var items = document.getElementsByName("check");  //获取name为check的一组元素(checkbox)

         for(i=; i < items.length; i++){  //循环这组数据

             if(items[i].checked){      //判断是否选中

                 arrays.push(items[i].value);  //把符合条件的 添加到数组中. push()是javascript数组中的方法.

             }

         }

         alert( "选中的个数为："+arrays.length  );

     }

 }

 </script>

 </head>

 <body>

 <form method="post" action="#">

     <input type="checkbox" value="" name="check" checked="checked"/>

     <input type="checkbox" value="" name="check" />

     <input type="checkbox" value="" name="check" checked="checked"/>

     <input type="button" value="你选中的个数" id="btn"/>

 </form>

 </body>

 </html>

锋利的Jquery(Table,Checkbox)的更多相关文章

  1. 《锋利的JQuery》读书要点笔记1——认识JQuery&&选择器

    <锋利的jQuery>源码下载,包括了这本书中全部代码以及用到的CSS文件 第一章 认识jQuery jQuery是个Js库.首先该明确的一点是:在jQuery库中$就是jQuery的一个 ...

  2. 锋利的jQuery学习总结

    通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结.此书主要讲解了jQuery的常用操作,包括认识jQuery,jQ ...

  3. 锋利的jQuery读书笔记---选择器

    前段时间入手了锋利的jQuery(第二版),想着加强下自己的js能力,可前段时间一只在熟悉Spring和Hibernate.最近抽时间开始读这本书了,随便也做了些记录. 读书的过程是边看边代码测试,所 ...

  4. Jquery实现checkbox按shift多选

    html <html> <head> <meta http-equiv="content-type" content="text/html; ...

  5. Jquery 组 checkbox双向控制与tr变色

    <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8&qu ...

  6. 锋利的jQuery（第二版）学习总结

    通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结. 此书主要讲解了jQuery的常用操作,包括认识jQuery,j ...

  7. Jquery全选系列操作（锋利的jQuery）

    Jquery全选系列操作(锋利的jQuery) <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...

  8. 《锋利的jQuery》读书笔记（DOM+事件）

    前阵子买了一批书,就从锋利的jQuery看起吧,书中一些太过常规以及没有强记必要性的操作就不记录了. 1.DOM加载后执行JS $(document).ready(function(){ //.... ...

  9. 5.2 《锋利的jQuery》jQuery对表格的操作（选项卡/换肤）

    表格隔行变色以及单选/复选 表格展开关闭 表格筛选 字体变大/缩小 选项卡 网页换肤 tip1: $("tr:odd")和$("tr:even")选择器索引是从 ...

随机推荐

  1. 理解MITRE ATT&CK矩阵

    最近准备学习一下关于ATT&CK的知识,这里面先来理解一下什么是ATT&CK(通过对ATT&CK的学习,可以很快的对安全领域有一个比较全面的认识). 什么是MITRE MITR ...

  2. npm run 同时执行多个命令

    在项目中可能需要一套代码同时部署几套环境,每一次改动就需要同时打包N次.这时就需要能够一个命令同时打包多次,省去了很多麻烦. 这里我们需要用到 concurrently 这个 npm 包,能够实现我们 ...

  3. Java-Class-@I：org.springframework.web.bind.annotation.RestController

    ylbtech-Java-Class-@I:org.springframework.web.bind.annotation.RestController 1.返回顶部   2.返回顶部 1. pack ...

  4. Delphi常用字符串函数

    Delphi常用字符串函数   一.字符转换函数1.ord(input[i])返回字符表达式 input 左端起第 I 字符的ASCII 码值.2.CHAR()将ASCII 码转换为字符.如果没有输入 ...

  5. 10.2 External interrupt/event controller (EXTI)

    EXTI控制器的主要特点如下: 每个中断/事件线上的独立触发器和掩码 每个中断行的专用状态位 生成最多20个软件事件/中断请求 脉冲宽度小于APB2时钟周期的外部信号检测. 每条中断线路的专用状态位生 ...

  6. Lombok 常用注解

    Lombok Lombok 能以简单的注解形式来简化 java 代码,提高开发人员的开发效率.例如开发中经常需要写的 javaBean,都需要花时间去添加相应的 getter/setter,也许还要去 ...

  7. C++之运算符_算数运算符

    运算符 **作用:**用于执行代码的运算 | **运算符类型** | **作用** || -------------- | -------------------------------------- ...

  8. 5-MySQL高级-事务-回滚(3)

    回滚 为了演示效果,需要打开两个终端窗口,使用同一个数据库,操作同一张表 step1:连接 终端1 select * from goods_cates; step2:增加数据 终端2:开启事务,插入数 ...

  9. C++列表初始化是初始化本类自身含有的成员变量，不能直接初始化继承过来的成员变量

    在构造函数体内赋值就是对的了

  10. iOS进阶四-自动释放池原理

    概述 AutoreleasePool(自动释放池)是OC中的一种内存自动回收机制,它可以延迟加入AutoreleasePool中的变量release的时机.在正常情况下,创建的变量会在超出其作用域的时 ...