前几天就遇到过这样的问题，明明我用的是('tr :even').css('background','#ccc')想改变表格中行的背景色，反复试了还是没改变。还问了度娘还是没找到原因所在（当时问题描述的方向错了）。今天再次遇到了这个问题，原来是我习惯性地把空格给加上了。

加了空格的效果是这样的：

去掉空格后得到了想要的样子：

以上两种结果可以看出，加了空格后选中的是其子元素，没加空格的才是指向它自身（暂时只在带冒号':'的选择器中遇到这个问题），一定要注意空格的问题，注意养成良好的编程习惯。

以下是代码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>表格变色</title>

    <style type="text/css">

        tr{

            margin-left: 10px;

        }

        td{

            width: 100px;

        }

        table th {

            border-width: 1px;

            padding: 8px;

            border-style: solid;

            border-color: #a9c6c9;

        }

        table td {

            text-align: center;

            border-width: 1px;

            padding: 8px;

            border-style: solid;

            border-color: #a9c6c9;

        }

    </style>

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

    <script type="text/javascript">

        $(function(){

            $('tr:even').css('background', '#F6E2E2');

        });

    </script>

</head>

<body>

    <table style="border:1px solid #000;padding: 5px;">

        <thead style="border-bottom:2px solid #000;margin-left: 4px; ">

            <tr><th>姓名</th><th>性别</th><th>暂住地</th></tr>

        </thead>

        <tbody>

            <tr>

                <td>张三</td>

                <td>男</td>

                <td>浙江宁波</td>

            </tr>

            <tr>

                <td>李四</td>

                <td>女</td>

                <td>浙江杭州</td>

            </tr>

            <tr>

                <td>王五</td>

                <td>男</td>

                <td>湖南长沙</td>

            </tr>

            <tr>

                <td>赵六</td>

                <td>男</td>

                <td>浙江温州</td>

            </tr>

            <tr>

                <td>Rain</td>

                <td>男</td>

                <td>浙江杭州</td>

            </tr>

            <tr>

                <td>Maxman</td>

                <td>女</td>

                <td>浙江杭州</td>

            </tr>

        </tbody>

    </table>

</body>

</html>

jQuery选择器中的空格问题的更多相关文章

  1. jquery 选择器中含有空格注意

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

  2. jquery选择器中两个class是什么意思？

    jquery选择器中两个class是什么意思? $(".class1 .class2") 选择class1元素下class2的元素(中间有空格)$(".class1.cl ...

  3. JQuery选择器中的一些注意事项

    1. 选择器中含有特殊符号的注意事项 1. 1 选择器中含有",","#","("或"]"等特殊字符 根据w3c的规定, ...

  4. 【轻松前端之旅】​CSS选择器中的空格与尖括号有何区别？

    CSS选择器中的空格与尖括号有何区别? 例子1: .a .b { margin: 0; } 空格隔开a和b,选择所有后代元素. 例子2: .a>.b { margin: 0; } 尖括号隔开a和 ...

  5. 处理jQuery选择器中的特殊符号，如（、#等

    前几天解决一个外网问题,客服反馈页面数据加载不出来,首先看一下服务端日志也没报错异常,自己测试了一下,在chrome的Console发现有js报错,原来是js报错导致的数据加载不出来. 调试了一番,发 ...

  6. jQuery选择器中的特殊符号和关键字

    一般情况下,在jQuery选择器中,我们很少会用到诸如"."."#"."("."["等特殊字符,因为根据W3C规定,HT ...

  7. jQuery选择器中空格的问题再探究

    jQuery选择器的空格问题,看似很小,但是差之毫厘谬以千里,让人很是恼火,<锋利的jQuery>书中有个经典的例子,我这里也拷贝下来,再加点自己的想法 <html> < ...

  8. 关于jquery的选择器中的空格问题

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

  9. jquery选择器中的find和空格，children和>的区别、及父节点兄弟节点，还有判断是否存在的写法

     一.find和空格,children和>及其它的区别   空格:$('parent childchild')表示获取parent下的所有的childchild节点(所有的子孙). 等效成  = ...

随机推荐

  1. 如何使用CocoaPods

    如何使用CocoaPods 1.进入主目录下 cd /Users/HYYT/Desktop/支付功能/微信支付宝集成/支付宝微信支付集成 2.建立Podfile(配置文件) 2.1  输入:vim P ...

  2. matlab函数：c2d离散化函数（待完善）

    Convert model from continuous to discrete time sysd =c2d(sys,Ts)sysd =c2d(sys,Ts,method)sysd =c2d(sy ...

  3. stm32串口通讯问题

    stm32串口通讯问题 在串口试验中,串口通讯不正常,则可能会出现以下问题: 1. 配置完成后,串口没有任何消息打印. 原因:1,端口配置有问题,需要重新检查I/O口的配置 2,接线有问题,检查接线是 ...

  4. APP被苹果App Store拒绝的79个原因【转】

    作为iOS开发者,估计有很多都遇到过APP提交到App Store被拒,然后这些被拒的原因多种多样,今天dApps收集了常见的被拒的原因,以便更多开发者了解. APP被苹果APPStore拒绝的各种原 ...

  5. 小结：Swift、OC语言中多target在代码中如何区分

    一.对swift工程 经实践,网上的方法都无法成功,后来思考DEBUG宏定义方式,经实测有效,方式如下: 注意:不能把swift flags 小三角折叠后双击设置-DTarget4AppStore, ...

  6. Unity3D 正六边形，环状扩散，紧密分布，的程序

    最近在做一个正六边形的游戏,被一开始的布局难倒了. 需求:中心有个正六边形,输入围绕中心扩散的环数,自动创建和摆放. 大概就是这样的吧,我觉得这个非常轻松的就可以搞定了.啊~~~~~啊~~~ 五环~~ ...

  7. ABAP 7.4 新语法-内嵌生命和内表操作

    1.内嵌声明 2.内表操作 3.opensql ************************************************************************ 1. ...

  8. CF #349 div1 B. World Tour

    题目链接:http://codeforces.com/problemset/problem/666/B 大意是给一张有向图,选取四个点,使得走这四个点,任意两个点之间走最短路,总距离最长. 3000个 ...

  9. Java数据结构和算法

    首先,本人自学java,但是只学习了java的基础知识,所以想接下来学习一下数据结构和算法,但是找了很多教材,大部分写的好的都是用c语言实现的,虽然知道数据结构和算法,跟什么语言实现的没有关系,但是我 ...

  10. js基本语法汇总

    1.分类 ECMAScript js基本语法与标准 DOM Document Object Model文档对象模型 BOM Browser Object Model浏览器对象模型 tips:DOM和B ...