关于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 相关文章推荐
JSQL SQLProxy 的 php 版本代码
May 05 Javascript
jQuery Selector选择器小结
May 06 Javascript
使用jquery.upload.js实现异步上传示例代码
Jul 29 Javascript
js对象继承之原型链继承实例
Jan 10 Javascript
JS取得绝对路径的实现代码
Jan 16 Javascript
jQuery制作简单柱状图实例
Jan 28 Javascript
JavaScript实现带播放列表的音乐播放器实例分享
Mar 07 Javascript
JS DOM实现鼠标滑动图片效果
Sep 17 Javascript
微信小程序云开发使用方法新手初体验
May 16 Javascript
不依任何赖第三方,单纯用vue实现Tree 树形控件的案例
Sep 21 Javascript
node使用async_hooks模块进行请求追踪
Jan 28 Javascript
vue-router路由懒加载及实现的3种方式
Feb 28 Vue.js
在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
详解WordPress中添加友情链接的方法
2016/05/21 PHP
Laravel 修改默认日志文件名称和位置的例子
2019/10/17 PHP
php+laravel依赖注入知识点总结
2019/11/04 PHP
小型js框架veryide.librar源代码
2009/03/05 Javascript
html向js方法传递参数具体实现
2013/08/08 Javascript
jquery库或JS文件在eclipse下报错问题解决方法
2014/04/17 Javascript
JS实现两个大数(整数)相乘
2014/04/28 Javascript
JQuery的Ajax中Post方法传递中文出现乱码的解决方法
2014/10/21 Javascript
Javascript 运动中Offset的bug解决方案
2014/12/24 Javascript
使用Node.js为其他程序编写扩展的基本方法
2015/06/23 Javascript
省市联动效果的简单实现代码(推荐)
2016/06/06 Javascript
Angular指令封装jQuery日期时间插件datetimepicker实现双向绑定示例
2017/01/22 Javascript
从零开始学习Node.js系列教程四:多页面实现数学运算的client端和server端示例
2017/04/13 Javascript
JavaScript类的继承操作实例总结
2018/12/20 Javascript
JS中的算法与数据结构之常见排序(Sort)算法详解
2019/08/16 Javascript
解决vue net :ERR_CONNECTION_REFUSED报错问题
2020/08/13 Javascript
谈谈JavaScript令人迷惑的==与+
2020/08/31 Javascript
关于uniApp editor微信滑动问题
2021/01/15 Javascript
[03:28]2014DOTA2国际邀请赛 EG战队官方纪录片
2014/07/21 DOTA
python快速查找算法应用实例
2014/09/26 Python
Python基于PycURL自动处理cookie的方法
2015/07/25 Python
Python学习笔记整理3之输入输出、python eval函数
2015/12/14 Python
各种Python库安装包下载地址与安装过程详细介绍(Windows版)
2016/11/02 Python
python基础教程之Filter使用方法
2017/01/17 Python
python 2.7.13 安装配置方法图文教程
2018/09/18 Python
git查看、创建、删除、本地、远程分支方法详解
2020/02/18 Python
Python3.7在anaconda里面使用IDLE编译器的步骤详解
2020/04/29 Python
Appium+Python实现简单的自动化登录测试的实现
2021/01/26 Python
利用python实现后端写网页(flask框架)
2021/02/28 Python
微信浏览器左上角返回按钮拦截功能
2017/11/21 HTML / CSS
安纳塔拉酒店度假村及水疗官方网站:Anantara Hotel
2016/08/25 全球购物
日本乐天官方海外转运服务:Rakuten Global Express
2018/11/30 全球购物
MONNIER Frères英国官网:源自巴黎女士奢侈品配饰电商平台
2018/12/06 全球购物
大学生毕业求职信
2014/06/12 职场文书
幼儿园中秋节活动总结
2015/03/23 职场文书
学术会议开幕词
2016/03/03 职场文书