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 相关文章推荐
jquery的ajax简单结构示例代码
Feb 17 Javascript
js实现点击链接后延迟3秒再跳转的方法
Jun 05 Javascript
Angular发布1.5正式版,专注于向Angular 2的过渡
Feb 18 Javascript
Bootstrap CSS组件之分页(pagination)和翻页(pager)
Dec 17 Javascript
JS实现搜索框文字可删除功能
Dec 28 Javascript
vue拦截器Vue.http.interceptors.push使用详解
Apr 22 Javascript
浅谈angularJs函数的使用方法(大小写转换,拷贝,扩充对象)
Oct 08 Javascript
Electron autoUpdater实现Windows安装包自动更新的方法
Dec 24 Javascript
微信小程序移动拖拽视图-movable-view实例详解
Aug 17 Javascript
微信小程序canvas开发水果老虎机的思路详解
Feb 07 Javascript
微信小程序scroll-view隐藏滚动条的方法详解
Mar 25 Javascript
JavaScript实现4位随机验证码的生成
Jan 28 Javascript
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
从一个不错的留言本弄的mysql数据库操作类
2007/09/02 PHP
ThinkPHP模板引擎之导入资源文件方法详解
2014/06/18 PHP
CI框架支持$_GET的两种实现方法
2016/05/18 PHP
Yii+upload实现AJAX上传图片的方法
2016/07/13 PHP
了解jQuery技巧来提高你的代码(个人觉得那个jquery的手册很不错)
2012/02/10 Javascript
从阶乘函数对比Javascript和C#的异同
2012/05/31 Javascript
JavaScript全排列的六种算法 具体实现
2013/06/29 Javascript
js中array的sort()方法使用介绍
2014/02/20 Javascript
Ext修改GridPanel数据和字体颜色、css属性等
2014/06/13 Javascript
Javascript与jQuery方法的隐藏与显示
2015/01/19 Javascript
实例分析浏览器中“JavaScript解析器”的工作原理
2016/12/12 Javascript
ionic+AngularJs实现获取验证码倒计时按钮
2017/04/22 Javascript
webpack进阶——缓存与独立打包的用法
2017/08/02 Javascript
使用Vue调取接口,并渲染数据的示例代码
2019/10/28 Javascript
Vue extend的基本用法(实例详解)
2019/12/09 Javascript
JavaScript实现Tab选项卡切换
2020/02/13 Javascript
微信小程序:报错(in promise) MiniProgramError
2020/10/30 Javascript
Windows下实现Python2和Python3两个版共存的方法
2015/06/12 Python
Python找出9个连续的空闲端口
2016/02/01 Python
python判断完全平方数的方法
2018/11/13 Python
Python3 Post登录并且保存cookie登录其他页面的方法
2018/12/28 Python
Python图像的增强处理操作示例【基于ImageEnhance类】
2019/01/03 Python
python 自动轨迹绘制的实例代码
2019/07/05 Python
class类在python中获取金融数据的实例方法
2020/12/10 Python
使用Python封装excel操作指南
2021/01/29 Python
Michael Kors美国官网:美式奢侈生活风格的代表
2016/11/25 全球购物
俄罗斯三星品牌商店:GalaxyStore
2020/11/04 全球购物
什么是SQL Server的确定性函数和不确定性函数
2016/08/04 面试题
自荐信格式范文
2013/10/07 职场文书
儿科护士自我鉴定
2013/10/14 职场文书
采购主管工作职责
2013/12/12 职场文书
打架赔偿协议书范本
2014/10/26 职场文书
师德师风学习材料
2014/12/19 职场文书
运动会5000米加油稿
2015/07/21 职场文书
四则混合运算教学反思
2016/02/23 职场文书
海康机器人重磅发布全新算法开发平台VM4.2
2022/04/21 数码科技