文档章节

jQuery对象与dom对象相互转换

 新新
发布于 2014/06/27 19:00
字数 588
阅读 387
收藏 16

精选30+云产品,助力企业轻松上云!>>>

什么是jQuery对象?

---就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法。

比如:

$("#test").html() 意思是指:获取ID为test的元素内的html代码。其中html()是jQuery里的方法

这段代码等同于用DOM实现代码:

虽然jQuery对象是包装DOM对象后产生的,但是jQuery无法使用DOM对象的任何方法,同理DOM对象也不能使用jQuery里的方法. 乱使用会报错。比如:$("#test").innerHTML、document.getElementById("id").html()之类的写法都是错误的。

还有一个要注意的是:用#id作为选择符取得的是jQuery对象与document.getElementById("id")得到的DOM对象,这两者并不等价。请参看如下说的两者间的转换。

既然jQuery有区别但也有联系,那么jQuery对象与DOM对象也可以相互转换。在再两者转换前首先我们给一个约定:如果一个获取的是 jQuery对象,那么我们在变量前面加上$,如:var $variab = jQuery对象;如果获取的是DOM对象,则与习惯普通一样:var variab = DOM对象;这么约定只是便于讲解与区别,实际使用中并不规定。

jQuery对象转成DOM对象:

两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index);

(1)jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象。

如:var $v =$("#v") ; //jQuery对象

var v=$v[0]; //DOM对象

alert(v.checked) //检测这个checkbox是否被选中

(2)jQuery本身提供,通过.get(index)方法,得到相应的DOM对象

如:var $v=$("#v"); //jQuery对象

var v=$v.get(0); //DOM对象

alert(v.checked) //检测这个checkbox是否被选中

DOM对象转成jQuery对象:

对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。$(DOM对象)

如:var v=document.getElementById("v"); //DOM对象

var $v=$(v); //jQuery对象

转换后,就可以任意使用jQuery的方法了。

通过以上方法,可以任意的相互转换jQuery对象和DOM对象。需要再强调注意的是:DOM对象才能使用DOM中的方法,jQuery对象是不可以用DOM中的方法。


粉丝 3
博文 35
码字总数 2628
作品 0
深圳
程序员
私信 提问
加载中
请先登录后再评论。
jQuery对象和DOM对象之间的转换实现

本文主要向大家介绍了jQuery对象和DOM对象之间互相转换的方法,其实转换过程十分简单,一起来看看吧。 在讨论jQuery对象和DOM对象的相互交换之前,先约定好定义变量的风格。如果获取的对象是...

wuxlcn
2015/03/02
16
0
js-jQuery对象与dom对象相互转换

核心提示:jquery选择器得到的jquery对象和标准的 javascript中的document.getElementById()取得的dom对象是两种不同的对象类型,一般情况下,如S(’#id’)得到的是jquery对象,它不能使用j...

Carl_
2014/08/26
38
0
[转] jQuery对象与DOM对象之间的转换

http://wozailongyou.iteye.com/blog/299311 http://blog.allenm.me/2009/07/jquery%E4%B8%ADid%E5%92%8Cdocumentgetelementbyidid%E7%9A%84%E5%8C%BA%E5%88%AB/ 刚开始学习jQuery,可能一时......

RobotTech
2013/09/06
0
0
jquery与dom的转换

什么是jQuery对象? ---就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法。 比如: $("#test").html() 意思是指:获取ID为test的元素内的html代...

柒月-小妖精
2013/04/12
22
0
jQuery对象和DOM对象之间的转换实现

本文主要向大家介绍了jQuery对象和DOM对象之间互相转换的方法,其实转换过程十分简单,一起来看看吧。 在讨论jQuery对象和DOM对象的相互交换之前,先约定好定义变量的风格。如果获取的对象是...

IanSun
2015/03/14
59
1

没有更多内容

加载失败,请刷新页面

加载更多

Android错误:无法在设备上安装* .apk *:超时 - Android error: Failed to install *.apk on device *: timeout

问题: I'm getting this error from time to time and don't know what causing this: 我不时收到这个错误,不知道是什么导致这个: When trying to run/debug an Android app on a real de......

富含淀粉
28分钟前
9
0
CKEditor 5 + SpringBoot实战(三):SpringData JPA数据持久化

在本系列的文章中,我将介绍如何在Spring Boot Application中使用CKEditor编辑器。介绍的内容包括基本环境的搭建,文件上传,SpringData JPA数据持久化,CKEditor5的安装,CKEditor图片上传,...

树下魅狐
46分钟前
5
0
直播 | 百度地图智能物流解决方案全新发布

本文作者:用****9 物流行业历经规模化增长阶段之后,开始更加注重效率的提高、成本的降低以及服务质量的提升。早在2015年,百度地图开放平台就推出了快递物流行业解决方案,并通过线上、线下...

百度开发者中心
04/16
7
0
Confluence 如何查看页面 ID

如果你希望查看页面的 ID 你有 2 个方法。 例如,你希望查看 https://www.cwiki.us/display/CONFLUENCEWIKI/Get+started 页面的 Page ID 的话。 如果你的标题栏没有特殊字符,那么将会使用英...

honeymoose
今天
11
0
Linux系统 Centos7 环境基于Docker部署Rocketmq服务

消息队列 基本概述 MQ,Message Queue,基于TCP协议构建的简单协议,区别于具体的通信协议。 基于通信协议定义和抽象的更高层次的通信模型,一般都是生产者和消费者模型,又或者说服务端和客户端...

mazhilin
今天
12
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部