jquery操作对象数组元素方法详解


Posted in Javascript onNovember 26, 2014

代码如下:

 <div id="div1">

     <span>a</span>

     <span>b</span>

     <span>c</span>

 </div>

1.错误方式:不能用[]方式取jquery对象数组,如下:

 $(function() {

     var div_span = $("#div1 span");

     for( var i = 0; i < div_span.length; i++ ) {

         div_span.[i].html(i);

     }

 });

这样无效.

2.可以用jquery的eq()方法来选择:

 for( var i = 0; i < div_span.length; i++ ) {

     div_span.eq(i).html(i);

 }

3.可以用each()方法来遍历:

 $(function() {

     var div_span = $("#div1 span");

     var i = 0;

     div_span.each( function(){

         $(this).html(i);

         i++;

     });

 });

each()遍历的时候,如果用$(this)得到的是jquery对象,如果直接用this,得到的是DOM对象

4.纯js代码获取的DOM对象数组,可以用[]的方式获取数组元素

后面3种是正确的方法,第一种是错误的,把他放在第一个,是因为要强调下,以后不能再犯同样的错误了,小伙伴们可要看仔细哈。

Javascript 相关文章推荐
javascript IE中的DOM ready应用技巧
Jul 23 Javascript
关于JAVASCRIPT urldecode URL解码的问题
Jan 08 Javascript
分享一个自定义的console类 让你不再纠结JS中的调试代码的兼容
Apr 20 Javascript
JavaScript中的this关键字介绍与使用实例
Jun 21 Javascript
jQuery提示插件qTip2用法分析(支持ajax及多种样式)
Jun 08 Javascript
JS常用算法实现代码
Nov 14 Javascript
微信小程序 setData使用方法及常用错误解决办法
May 11 Javascript
Vue EventBus自定义组件事件传递
Jun 25 Javascript
Angular封装搜索框组件操作示例
Apr 25 Javascript
java实现单链表增删改查的实例代码详解
Aug 30 Javascript
vue+导航锚点联动-滚动监听和点击平滑滚动跳转实例
Nov 13 Javascript
js中forEach,for in,for of循环的用法示例小结
Mar 14 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
node.js+Ajax实现获取HTTP服务器返回数据
Nov 26 #Javascript
You might like
无数据库的详细域名查询程序PHP版(1)
2006/10/09 PHP
探讨PHP函数ip2long转换IP时数值太大产生负数的解决方法
2013/06/06 PHP
IIS6.0 开启Gzip方法及PHP Gzip函数分享
2014/06/08 PHP
php中各种定义变量的方法小结
2017/10/18 PHP
PHP笛卡尔积实现算法示例
2018/07/30 PHP
ie和firefox中img对象区别的困惑
2006/12/27 Javascript
Jquery优化效率 提升性能解决方案
2010/09/06 Javascript
jQuery源码分析-02正则表达式 RegExp 常用正则表达式
2011/11/14 Javascript
创建公共调用 jQuery Ajax 带返回值
2012/08/01 Javascript
js函数排序的实例代码
2013/07/01 Javascript
一个JavaScript用逗号分割字符串实例
2014/09/22 Javascript
javascript运动详解
2015/07/06 Javascript
跨域资源共享 CORS 详解
2016/04/26 Javascript
js合并两个数组生成合并后的key:value数组
2018/05/09 Javascript
JavaScript引用类型之基本包装类型实例分析【Boolean、Number和String】
2018/08/09 Javascript
搭建基于express框架运行环境的方法步骤
2018/11/15 Javascript
基于mpvue的简单弹窗组件mptoast使用详解
2019/08/02 Javascript
[02:12]Dota 2 推出全新英雄—— 电炎绝手
2019/08/23 DOTA
[35:39]完美世界DOTA2联赛PWL S2 FTD.C vs Rebirth 第二场 11.22
2020/11/24 DOTA
Python操作MySQL数据库9个实用实例
2015/12/11 Python
python中安装模块包版本冲突问题的解决
2017/05/02 Python
python学习入门细节知识点
2018/03/29 Python
Python django使用多进程连接mysql错误的解决方法
2018/10/08 Python
Python后台开发Django的教程详解(启动)
2019/04/08 Python
查看keras的默认backend实现方式
2020/06/19 Python
Django实现内容缓存实例方法
2020/06/30 Python
1亿有多大教学反思
2014/05/01 职场文书
大型会议策划方案
2014/05/17 职场文书
师德师风自查总结
2014/10/14 职场文书
保研推荐信范文
2015/03/25 职场文书
感恩教育观后感
2015/06/17 职场文书
缅怀先烈主题班会
2015/08/14 职场文书
2016年元旦寄语
2015/08/17 职场文书
导游词之白茶谷九龙峡
2019/10/23 职场文书
Laravel中获取IP的真实地理位置
2021/04/01 PHP
Java数据结构之链表相关知识总结
2021/06/18 Java/Android