关于jQuery object and DOM element


Posted in Javascript onApril 15, 2013

源起:

<div id="test1">
              <span>text1</span>
              <span>text2</span>
              <span>text3</span>
       </div>

想取得span element 里面的文本, 发现$("#test1 span")[0]取出来的不是jQuery object, 只能用$($("#test1 span")[0]).text()转为jQuery再取了,但是两个$一起总感觉怪怪的,退而求其次便用了取值$("#test1 span")[0].textContent or $("#test1 span")[0].innerHTML jQuery object and DOM elementjQuery object是一种类数组对象(array-like),可以包含一个或者多个DOM element(s)。而jQuery functions 的操作是建立在jQuery object上而不是DOM object上。eg. jQuery object  “Object[span, span, span] ” 包含一个或者多个DOM element “<span>”。访问jQuery object里面DOM element的方式:
$("selector")[0] // Accesses the first DOM element in this jQuery object
$("selector").get(0) // Equivalent to the code above
$("selector").get() // Retrieve a true array of DOM elements matched by this selector

或者非jQuery方式:
document.getElementsByTagName("div") // Return HTMLcollection

Javascript 相关文章推荐
jquery 输入框数字限制插件
Nov 10 Javascript
asp.net+js 实现无刷新上传解析csv文件的代码
May 17 Javascript
JS实现下拉框的动态添加(附效果)
Apr 03 Javascript
JQuery-tableDnD 拖拽的基本使用介绍
Jul 04 Javascript
让人蛋疼的JavaScript语法特性
Sep 30 Javascript
JavaScript构造函数详解
Dec 27 Javascript
JavaScript实现带播放列表的音乐播放器实例分享
Mar 07 Javascript
URL的参数中有加号传值变为空格的问题(URL特殊字符)
Nov 04 Javascript
vue模板语法-插值详解
Mar 06 Javascript
轻松实现jQuery添加删除按钮Click事件
Mar 13 Javascript
angular实现图片懒加载实例代码
Jun 08 Javascript
原生js实现仿window10系统日历效果的实例
Oct 31 Javascript
在jQuery中 关于json空对象筛选替换
Apr 15 #Javascript
在Javascript中 声明时用&quot;var&quot;与不用&quot;var&quot;的区别
Apr 15 #Javascript
关于jQuery $.isNumeric vs. $.isNaN vs. isNaN
Apr 15 #Javascript
深入了解javascript中的prototype与继承
Apr 14 #Javascript
谈谈JavaScript中的函数与闭包
Apr 14 #Javascript
在新窗口打开超链接的方法小结
Apr 14 #Javascript
JS中setTimeout()的用法详解
Apr 14 #Javascript
You might like
用PHP中的 == 运算符进行字符串比较
2006/11/26 PHP
详解PHP编码转换函数应用技巧
2016/10/22 PHP
在laravel框架中实现封装公共方法全局调用
2019/10/14 PHP
javascript之可拖动的iframe效果代码
2008/08/01 Javascript
JavaScript是否可实现多线程  深入理解JavaScript定时机制
2009/12/22 Javascript
6个DIV 135或246间隔一秒轮番显示效果
2010/07/24 Javascript
FusionCharts图表显示双Y轴双(多)曲线
2012/11/22 Javascript
浅析hasOwnProperty方法的应用
2013/11/20 Javascript
JS获取url链接字符串 location.href
2013/12/23 Javascript
JavaScript中的函数重载深入理解
2014/08/04 Javascript
js实现分享到随页面滚动而滑动效果的方法
2015/04/10 Javascript
js如何打印object对象
2015/10/16 Javascript
JS实现的简单鼠标跟随DiV层效果完整实例
2015/10/31 Javascript
基于Bootstrap3表格插件和分页插件实例详解
2016/05/17 Javascript
webpack配置文件和常用配置项介绍
2017/04/28 Javascript
详解vue-cli构建项目反向代理配置
2017/09/07 Javascript
react-router browserHistory刷新页面404问题解决方法
2017/12/29 Javascript
vue+springboot实现项目的CORS跨域请求
2018/09/05 Javascript
vue 实现通过vuex 存储值 在不同界面使用
2019/11/11 Javascript
如何在wxml中直接写js代码(wxs)
2019/11/14 Javascript
JavaScript实现拖拽功能
2020/02/11 Javascript
vue用ant design中table表格,点击某行时触发的事件操作
2020/10/28 Javascript
使用vant的地域控件追加全部选项
2020/11/03 Javascript
[38:39]完美世界DOTA2联赛循环赛 IO vs GXR BO2第二场 11.04
2020/11/05 DOTA
Python使用pandas和xlsxwriter读写xlsx文件的方法示例
2019/04/09 Python
Python2.7版os.path.isdir中文路径返回false的解决方法
2019/06/21 Python
谈谈python垃圾回收机制
2020/09/27 Python
python pymysql库的常用操作
2020/10/16 Python
python tqdm实现进度条的示例代码
2020/11/10 Python
美国木工工具和用品商店:Woodcraft
2019/10/30 全球购物
应届毕业生求职信范文
2014/05/08 职场文书
食品安全标语
2014/06/07 职场文书
雷锋式好少年事迹材料
2014/08/17 职场文书
2015秋季开学典礼演讲稿
2015/07/16 职场文书
Nginx配置80端口访问8080及项目名地址方法解析
2021/03/31 Servers
详解前端任务构建利器Gulp.js使用指南
2021/04/30 Javascript