<!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. [LeetCode] Simplify Path（可以不用看）

    Given an absolute path for a file (Unix-style), simplify it. For example, path = "/home/", ...

  2. Magento去掉价格的小数点

    magento的默认情况,价格后面是有小数点的,我们来看下如何正确的来去掉小数点. 1.复制如下路径的文件 app/code/core/Mage/Directory/Model/Currency.ph ...

  3. jQuery实现隔行变色

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  4. opencv3.0+VS2015+64位win7配置

    首先,我们把所有用到的工具下载下来 VS2015         看这里,http://news.mydrivers.com/1/439/439398.htm,我下载的是专业版. OPENCV3.0 ...

  5. java.lang.IllegalArgumentException: No converter found for return value of type: class Person

    在http://www.cnblogs.com/winner-0715/p/6033462.html我们讲到三个条件就能实现SpringMVC返回json的功能 但是按照这三个条件配置后,运行出现了错 ...

  6. tabBaritem的图片偏移

    tabBarItem.imageInsets = UIEdgeInsetsMake(-10, 0, 10, 0);

  7. POJ1326问题描述

    Description Mileage program of ACM (Airline of Charming Merlion) is really nice for the travelers fl ...

  8. 微信小店 API 手册

    微信商铺API手册V1.13 目录 1.      商品管理接口.................................................................... ...

  9. Android --SwipeRefreshLayout 下拉刷新

    1.Layout <android.support.v4.widget.SwipeRefreshLayout android:id="@+id/id_swipe_ly" an ...

  10. JSP常用标签——JSTL标签和EL表达式

    一.JSTL简介 1.什么是JSTL JSTL是Java中的一个定制标记库集.(这个标记库集不需要自己编写,可以直接使用) 2.为什么要使用JSTL 实现了JSP页面中的代码复用(基于标签库原理,重复 ...