jquery选择器需要注意的问题


Posted in Javascript onNovember 26, 2014

我们先来看段代码,很简单,如下

<div id="div1">

    <span>111</span>

    <span>222</span>

    <span>333</span>

    <button id="button1">clear</button>

</div>
$(function() {

     $("#button1").click(function() {

         $("#div1 span").html("aaa");

     });

 });

$("#div1 span")获得三个对象的数组

1.如果执行 $("#div1 span").html("aaa"),则数组内的所有对象都会改变.如下图

jquery选择器需要注意的问题

2.如果执行$("#div1 span").html(),只取值的话,则只会取数组第一个对象的值

jquery选择器需要注意的问题

所以如果选择器获得是一个数组,要对数组每个元素都进行操作时,最好用each().

另外还有些注意事项

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

解决此类错误的方法是使用转义符转义。
<div id="id#b">bb</div>
<div id="id[1]">cc</div>

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

Javascript 相关文章推荐
js静态作用域的功能。
Dec 25 Javascript
jqgrid 简单学习笔记
May 03 Javascript
jQuery中:visible选择器用法实例
Dec 30 Javascript
jQuery常用知识点总结以及平时封装常用函数
Feb 23 Javascript
JS判断时间段的实现代码
Jun 14 Javascript
Angular 组件之间的交互的示例代码
Mar 24 Javascript
VSCode中如何利用d.ts文件进行js智能提示
Apr 13 Javascript
vue+webpack实现异步加载三种用法示例详解
Apr 24 Javascript
Vue-CLI 项目在pycharm中配置方法
Aug 30 Javascript
javascript设计模式 ? 状态模式原理与用法实例分析
Apr 22 Javascript
vue中是怎样监听数组变化的
Oct 24 Javascript
jQuery实现穿梭框效果
Jan 19 jQuery
jquery操作对象数组元素方法详解
Nov 26 #Javascript
node.js中的定时器nextTick()和setImmediate()区别分析
Nov 26 #Javascript
JavaScript定义类和对象的方法
Nov 26 #Javascript
node.js操作mongoDB数据库示例分享
Nov 26 #Javascript
教你如何使用node.js制作代理服务器
Nov 26 #Javascript
浅析node.js中close事件
Nov 26 #Javascript
node.js超时timeout详解
Nov 26 #Javascript
You might like
MVC模式的PHP实现
2006/10/09 PHP
php下保存远程图片到本地的办法
2010/08/08 PHP
php中convert_uuencode()与convert_uuencode函数用法实例
2014/11/22 PHP
php+xml编程之SimpleXML的应用实例
2015/01/24 PHP
PHP动态地创建属性和方法, 对象的复制, 对象的比较,加载指定的文件,自动加载类文件,命名空间
2016/05/06 PHP
php正则提取html图片(img)src地址与任意属性的方法
2017/02/08 PHP
js jquery数组介绍
2012/07/15 Javascript
JavaScript中的Math.SQRT1_2属性使用简介
2015/06/14 Javascript
jquery实现很酷的网页顶部图标下拉菜单效果
2015/08/22 Javascript
超漂亮的jQuery图片轮播特效
2015/11/24 Javascript
探究Vue.js 2.0新增的虚拟DOM
2016/10/20 Javascript
canvas的神奇用法
2017/02/03 Javascript
基于vue实现分页/翻页组件paginator示例
2017/03/09 Javascript
Bootstrap-table使用footerFormatter做统计列功能
2018/09/07 Javascript
在vue中动态添加class类进行显示隐藏实例
2019/11/09 Javascript
解析Python中while true的使用
2015/10/13 Python
分享Python开发中要注意的十个小贴士
2016/08/30 Python
基于Python __dict__与dir()的区别详解
2017/10/30 Python
Python列表推导式与生成器表达式用法示例
2018/02/08 Python
PyQt5内嵌浏览器注入JavaScript脚本实现自动化操作的代码实例
2019/02/13 Python
pyQt5实时刷新界面的示例
2019/06/25 Python
python简单区块链模拟详解
2019/07/03 Python
Windows 平台做 Python 开发的最佳组合(推荐)
2020/07/27 Python
详解pytorch中squeeze()和unsqueeze()函数介绍
2020/09/03 Python
3种方式实现瀑布流布局小结
2019/09/05 HTML / CSS
酒店工作职员求职简历的自我评价
2013/10/23 职场文书
大学英语演讲稿(中英文对照)
2014/01/14 职场文书
维修工先进事迹
2014/05/29 职场文书
廉政文化进校园广播稿
2014/10/20 职场文书
2014年大学团支部工作总结
2014/12/02 职场文书
经理聘任证明
2015/03/02 职场文书
运动会宣传语
2015/07/13 职场文书
SQL Server中交叉联接的用法详解
2021/04/22 SQL Server
MySQL笔记 —SQL运算符
2022/01/18 MySQL
python实现手机推送 代码也就10行左右
2022/04/12 Python
springboot集成redis存对象乱码的问题及解决
2022/06/16 Java/Android