• 技术文章 >web前端 >js教程

    jQuery选择器中含有空格的使用示例及注意事项_jquery

    2016-05-16 17:24:19原创482
    此文摘自《锋利的jQuery》,另外添加了一点自己的东西

    选择器中的空格是不容忽视的,多一个空格或少一个空格也许得到的结果会截然不同的。下面来看一个例子。

    先构建如下的HTML代码:
    复制代码 代码如下:


    Jquery教程

    Jquery学习

    Jquery插件






    jQuery代码:
    复制代码 代码如下:

    var $test_a = $(".test :hidden");//带空格的jQuery选择器
    var $test_b = $(".test:hidden");//不带空格的jQuery选择器
    var len_a = $test_a.length;
    var len_b = $test_b.length;
    alert("带空格的jQuery选择器选出的jQuery元素是:"+len_a+"个");//输出为4个
    alert("不带空格的jQuery选择器选出的jQuery元素是:"+len_b+"个");//输出为3个

    之所以会出现不同的结果,这就是后代选择器和过滤选择器的不同了
    复制代码 代码如下:

    var $test_a = $(".test :hidden");//带空格的jQuery选择器

    上面这段代码是选取class为“test”的元素里面的隐藏元素。(后代选择器)
    复制代码 代码如下:

    var $test_b = $(".test:hidden");//不带空格的jQuery选择器

    这上面的代码则是选取隐藏的class为“test”的元素

    注意:
    有的选择器的用法,必须是空格,如果不带空格的话,那就取不到元素,比如:
    复制代码 代码如下:

    $("select:selected").length;//不管任何时候,这个选择器都取不到元素,这个length必然是0
    $("select :selected");//这样才是正确的

    有的选择器的用法,必须不带空格,如果带空格的话,那就取不到元素,比如:
    复制代码 代码如下:

    $("input :checked").length;//不管任何时候,这个选择器都取不到元素,这个length必然是0
    $("input:checked");//这样才是正确的
    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:jQuery 选择器 空格
    上一篇:JQuery筛选器全系列介绍_jquery 下一篇:关于IE中getElementsByClassName不能用的问题解决方法_javascript技巧
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【活动】充值PHP中文网VIP即送云服务器• 实例介绍javaScript操作字符串的一些常用方法• JavaScript中数组常用的7种迭代处理方法总结• JavaScript实现十大排序算法(图文详解)• 归纳整理JavaScript数组操作方法• JavaScript构造函数创建对象(总结分享)
    1/1

    PHP中文网