zoukankan      html  css  js  c++  java
  • 选择器中含有特殊符号的注意事项

    一、选择器中含有特殊符号的注意事项

    1.选择器中含有“.”、“#”、“(”或“]”等特殊字符
    根据W3C的规定,属性值中是不能含有这些特殊字符的,但在实际项目中偶尔会遇到表达式中含有“#”和“.”等特殊字符,如果按照普通的方式去处理出来的话就会出错。解决此类错误的方法是使用转义符转义。

    <div id="id#b">bb</div> 
    < div id="id[1]">cc</div> 
    

    不能这样写:
    (('#id#b'); )('#id[1]');

    应该使用转义符号:
    (('#id\#b'); //转义特殊字符“#” )('#id[1]'); //转义特殊字符“[ ]”

    2.属性选择器的引号问题
    1.3.1版本彻底放弃了1.1.0版本遗留下的@符号,如果你使用1.3.1以上的版本,那么你不能在属性前添加@符号,比如:

    $('div[@title="test"'];
    

    正确的写法是:

    $('div[title="test"'];
    

    二、选择器中含有空格的注意事项

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

    <div class="test"> 
    <div style="display:none;">aa</div> 
    <div style="display:none;">bb</div> 
    <div style="display:none;">cc</div> 
    <div class="test" style="display:none;">dd</div> 
    < /div> 
    < div class="test" style="display:none;">ee</div> 
    < div class="test" style="display:none;">ff</div>
    

    使用如下的jQuery选择器分别获取它们。

    //注意区分类似这样的选择器 
    //虽然一个空格,却截然不同的效果. 
    var $t_a = $('.test :hidden'); 
    var $t_b = $('.test:hidden'); 
    var len_a = $t_a.length; 
    var len_b = $t_b.length; 
    alert("$('.test :hidden') = "+len_a); //输出 4 
    alert("$('.test:hidden') = "+len_b); //输出 3
    

    之所以会出现不同的结果,是因为后代选择器与过滤选择器的不同。
    var $t_a = $('.test :hidden'); //有空格 是选取class为“test”的元素里面的隐藏元素。

    var $t_b = $('.test:hidden'); //没有空格 则是选取隐藏的class为“test”的元素。
    

    这点和css是一样的 css中假如有个div有两个class属性.top 和 .right

    ,在css中我们要选择它定义样式只能这样写 .top.right{ } 而不能写成.top .right{ }

  • 相关阅读:
    WPF 如何创建自己的WPF自定义控件库
    浅谈WPF的VisualBrush
    从Oracle数据库中查询前几个月数据时需要注意的一些问题
    WPF当属性值改变时利用PropertyChanged事件来加载动画
    java array to list
    nGrinder 简易使用教程
    页面json 格式化+颜色高亮
    通过maven test 报org.apache.ibatis.binding.BindingException: Invalid bound statement
    jenkins 多选框
    jstack jstat 简易使用教程
  • 原文地址:https://www.cnblogs.com/moyuling/p/4568610.html
Copyright © 2011-2022 走看看