选择器中含有特殊符号的注意事项
来源:互联网 发布:广州游戏编程培训 编辑:程序博客网 时间:2024/05/25 19:55
1.选择器中含有“.”、“#”、“(”或“]”等特殊字符
根据W3C的规定,属性值中是不能含有这些特殊字符的,但在实际项目中偶尔会遇到表达式中含有“#”和“.”等特殊字符,如果按照普通的方式去处理出来的话就会出错。解决此类错误的方法是使用转义符转义。
HTML代码如下:
折叠展开XML/HTML 代码复制内容到剪贴板
- <div id="id#b">bb</div>
- <div id="id[1]">cc</div>
如果按照普通的方式来获取,例如:
折叠展开JavaScript 代码复制内容到剪贴板
- $('#id#b');
- $('#id[1]');
以上代码不能正确获取到元素,正确的写法如下:
折叠展开JavaScript 代码复制内容到剪贴板
- $('#id\\#b'); //转义特殊字符“#”
- $('#id\\[1\\]'); //转义特殊字符“[ ]”
2.属性选择器的引号问题
1.3.1版本彻底放弃了1.1.0版本遗留下的@符号,如果你使用1.3.1以上的版本,那么你不能在属性前添加@符号,比如:
折叠展开JavaScript 代码复制内容到剪贴板
- $('div[@title="test"'];
正确的写法是去掉@符号,比如:
折叠展开JavaScript 代码复制内容到剪贴板
- $('div[title="test"'];
二、选择器中含有空格的注意事项
选择器中的空格也是不容忽视的,多一个空格或少一个空格也许会得到截然不同的结果。看下面这个例子,它的HTML代码如下:
折叠展开XML/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选择器分别获取它们。
之所以会出现不同的结果,是因为后代选择器与过滤选择器的不同。
折叠展开JavaScript 代码复制内容到剪贴板
- //注意区分类似这样的选择器
- //虽然一个空格,却截然不同的效果.
- 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
之所以会出现不同的结果,是因为后代选择器与过滤选择器的不同。
折叠展开JavaScript 代码复制内容到剪贴板
- var $t_a = $('.test :hidden'); //有空格
以上代码是选取class为“test”的元素里面的隐藏元素。lodidance.com
而代码:
折叠展开JavaScript 代码复制内容到剪贴板
- var $t_b = $('.test:hidden'); //没有空格
0 0
- 选择器中含有特殊符号的注意事项
- jQuery选择器中含有空格和特殊符号的注意事项
- jQuery选择器 含有特殊符号和含有空格的注意事项
- jQuery选择器中含有空格的注意事项
- jQuery选择器中含有空格的注意事项
- jQuery选择器中含有空格的注意事项
- jQuery选择器中含有空格的注意事项
- jQuery选择器中含有空格的注意事项
- 选择器中含有空格的注意事项
- 选择器中含有空格的注意事项
- 【转】jQuery选择器中含有空格的注意事项
- python解析URL中含有特殊符号的地址
- jquery选择器中含有不含有空格的问题
- jquery获取的id含有特殊符号怎么办
- jQuery中选择器空格注意事项
- linux下tar解压含有特殊符号的文件
- js append 含有引号等特殊符号的报错
- php插入数据含有特殊符号的处理方法
- android中开启线程
- Win7系统桌面右下角显示黄色感叹号的解决方法
- QT 判断当前焦点是否在某控件上
- Swift Objective-C混用
- WebDriver中如何给元素设置焦点
- 选择器中含有特殊符号的注意事项
- 视图分割与视图之间通信
- Android服务之Service(其一)
- 模态视图
- 你就叫我无题吧
- 谷歌笔试题解
- Uboot--Linux参数传递--FDT扁平设备树
- iOS-----GCD
- Ubuntu(Debian)的aptitude与apt-get的区别和联系