<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <script src="js/jquery.js"></script>

        <script>

            window.onload = function(){

                document.getElementById('btnok').onclick = function(){

                    //1.匹配第一个单元格

                    //$('td:first').html('test');

                    //2.匹配最后一个单元格

                    //$('td:last').html('test');

                    //3.通过odd和even实现隔行变色

                    //$('td:odd').css('backgroundColor','red');

                    //4.匹配索引为5的单元格

                    //$('td:eq(5)').css('backgroundColor','red');

                    //5匹配索引大于5的所有单元格

                    //$('td:gt(5)').css('backgroundColor','red');

                    //6.匹配索引小于5的所有单元格

                    //$('td:lt(5)').css('backgroundColor','red');

                    //7.匹配除索引5以外的所有td元素

                    $('td:not(td:eq(5))').css('backgroundColor','red');

                }

            }

        </script>

    </head>

    <body>

        <input type="button" id="btnok" value="匹配" />

        <br/>

        <table width="800" border="1">

            <tr>

                <td>0</td>

                <td>1</td>

                <td>2</td>

                <td>3</td>

                <td>4</td>

                <td>5</td>

                <td>6</td>

                <td>7</td>

                <td>8</td>

                <td>9</td>

            </tr>

        </table>

    </body>

</html>

夺命雷公狗jquery---3普通选择器的更多相关文章

  1. 夺命雷公狗-----React---12--添加类和样式

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

  2. 夺命雷公狗-----React---11--添加css样式的方法

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

  3. 夺命雷公狗-----React---10--组建嵌套进行数据遍历

    先写一个组建... 然后进行嵌套.. <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  4. 夺命雷公狗-----React---9--map数据的遍历

    比如我们要实现的是这种效果: 用这种方法来写,她只能写死在哪,没啥意思,所以我们定义一个数据,然后来测试下map方法对她遍历出来的数据 <!DOCTYPE html> <html l ...

  5. 夺命雷公狗-----React---8--react官方提供的组建实现双向绑定

    首先要引入她.. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  6. 夺命雷公狗-----React---7--组建的状态props和state

    props:组建初始要渲染的数据,他是不可以改变的 state:组建状态发生改变,调用render重新渲染数据 我们来写一个例子: <!DOCTYPE html> <html lan ...

  7. 夺命雷公狗-----React---6--props多属性的传递

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. 夺命雷公狗-----React---5--props对象的传递

    提示:props的值是不可以改变的... <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  9. 夺命雷公狗-----React---4--props变量的传递

    提示:props的值是不可以改变的... <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  10. 夺命雷公狗-----React---3--标签的规则

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 转NodeJS的npm模块版本号 模式解析

    npm 中的模块版本都需要遵循 semver 2.0 的语义化版本规则. 版本格式:主版本号.次版本号.修订号,版本号递增规则如下: 主版本号:当你做了不兼容的API 修改, 次版本号:当你做了向下兼 ...

  2. HAL层Camera模块Dump图片--工作积累

    Camera的raw data一般都是YUV420的格式,数据的特点是: YUV 4:2:0采样,每四个Y共用一组UV分量 YUV420格式: 先Y,后V,中间是U.其中的Y是w * h,U和V是w/ ...

  3. .Net程序员安卓学习之路5：使用xutils注入View和事件以及图片的显示

    xUtils注入和图片显示 一.xUtils注入 引用官方介绍: ViewUtils模块: •android中的ioc框架,完全注解方式就可以进行UI,资源和事件绑定: •新的事件绑定方式,使用混淆工 ...

  4. 让Eclipse不格式化数组或某段代码

    用过eclipse ctrl+shit+f的人肯定都感觉eclipse这个功能很爽. 但对于数组,有时候就不是这样了. 比如在opengl中定义一些顶点信息: int one = 0x010000; ...

  5. Nmap 網路診斷工具基本使用技巧與教學

    Nmap 是一個開放原始碼的網路掃描與探測工具,可以讓網路管理者掃描整個子網域或主機的連接埠等,功能非常強大. Nmap(Network Mapper)是一個開放原始碼的網路檢測工具,它的功能非常強大 ...

  6. office-002-onenote、word、outlook取消首字母大小写图文详解

    此文主要讲述如何取消微软办公软件 onenote.work.outlook 中首字母大写等的自动更正项,其他 office 办公软件相关设置的操作,可参考此文进行相应的设置.希望能对亲有所帮助,若有错 ...

  7. 被druid折磨的够呛

    使用德鲁伊数据库连接池 数据源是这么配的 <!--数据源--> <bean id="dataSource" class="com.alibaba.dru ...

  8. Oracle利用external table 查看trace文件

    1. 用下面的语句找到trace文件的路径 select * from v$diag_info where name='Default Trace File'; 2. 创建一个directory用来加 ...

  9. nodejs weixin 笔记

    http://www.oschina.net/code/snippet_218887_25870 好文章: http://codelife.me/blog/2013/04/23/developing- ...

  10. JS函数（获得widn）

    //随机数生成器Math.random() 日期时间函数(需要用变量调用):var b = new Date(); //获取当前时间b.getTime() //获取时间戳b.getFullYear() ...