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 相关文章推荐
对象的类型:本地对象(1)
Dec 29 Javascript
html a标签-超链接中confirm方法使用介绍
Jan 04 Javascript
JQuery实现Ajax加载图片的方法
Dec 24 Javascript
轻松实现javascript图片轮播特效
Jan 13 Javascript
微信小程序 wxapp内容组件 icon详细介绍
Oct 31 Javascript
jquery pagination分页插件使用详解(后台struts2)
Jan 22 Javascript
Angular 4依赖注入学习教程之InjectToken的使用(八)
Jun 04 Javascript
vue在使用ECharts时的异步更新和数据加载详解
Nov 22 Javascript
Angular 项目实现国际化的方法
Jan 08 Javascript
使用proxy实现一个更优雅的vue【推荐】
Jun 19 Javascript
Javascript实现动态时钟效果
Nov 17 Javascript
node.js基础知识汇总
Aug 25 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
PHP curl模拟浏览器采集阿里巴巴的实现代码
2011/04/20 PHP
Smarty分页实现方法完整实例
2016/05/11 PHP
jquery中ajax学习笔记4
2011/10/16 Javascript
js控制网页背景音乐播放与停止的方法
2015/02/06 Javascript
jQuery实现选项卡切换效果简单演示
2015/12/09 Javascript
jquery中ajax处理跨域的三大方式
2016/01/05 Javascript
学习Javascript面向对象编程之封装
2016/02/23 Javascript
Immutable 在 JavaScript 中的应用
2016/05/02 Javascript
JS组件系列之Bootstrap table表格组件神器【二、父子表和行列调序】
2016/05/10 Javascript
jQuery实现磁力图片跟随效果完整示例
2016/09/16 Javascript
JS键盘版计算器的制作方法
2016/12/03 Javascript
layui表格checkbox选择全选样式及功能的实例
2018/03/07 Javascript
Vue+Node服务器查询Mongo数据库及页面数据传递操作实例分析
2019/12/20 Javascript
[01:10]为家乡而战!完美世界城市挑战赛全国总决赛花絮
2019/07/25 DOTA
python实现网页链接提取的方法分享
2014/02/25 Python
python实现保存网页到本地示例
2014/03/16 Python
Python之NumPy(axis=0 与axis=1)区分详解
2019/05/27 Python
Python处理时间日期坐标轴过程详解
2019/06/25 Python
tensorflow ckpt模型和pb模型获取节点名称,及ckpt转pb模型实例
2020/01/21 Python
浅谈python输出列表元素的所有排列形式
2020/02/26 Python
Python random库使用方法及异常处理方案
2020/03/02 Python
美国打印机墨水和碳粉购物网站:QuikShip Toner
2018/08/29 全球购物
小学教师岗位职责
2013/11/25 职场文书
仓库管理制度
2014/01/21 职场文书
节能环保标语
2014/06/12 职场文书
服装设计专业求职信
2014/06/16 职场文书
爱护草坪标语
2014/06/24 职场文书
经典演讲稿开场白
2014/08/25 职场文书
乡镇机关党员民主评议表自我评价
2014/09/21 职场文书
公司离职证明标准范本
2014/10/05 职场文书
小平小道观后感
2015/06/09 职场文书
商务宴会祝酒词
2015/08/11 职场文书
考生诚信考试承诺书(2016版)
2016/03/25 职场文书
2019年暑期安全广播稿!
2019/07/03 职场文书
iPhone13 Pro外观确定,升级4800万镜头,4月20日发新品
2021/04/15 数码科技
Python可视化神器pyecharts之绘制地理图表练习
2022/07/07 Python