`
ygsilence
  • 浏览: 332406 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

jQuery对象与dom对象相互转换(转)

 
阅读更多

刚开始学习jQuery,可能一时会分不清楚哪些是jQuery对象,哪些是DOM对象。至于DOM对象不多解释,我们接触的太多了,下面重点介绍一下jQuery,以及两者相互间的转换。

什么是jQuery对象?

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

比如:

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

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

 

document.getElementById("id").innerHTML;

 

虽然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中的方法。

分享到:
评论

相关推荐

    jQuery对象和DOM对象之间相互转换的方法介绍

    主要介绍了jQuery对象和DOM对象之间相互转换的方法介绍,本文讲解了jQuery对象转成DOM对象、DOM对象转换成jQuery对象方法,需要的朋友可以参考下

    Java电商系统+Java学习资料+Java教程第23节+23-jquery对象与dom对象之间相互转化

    Java电商系统+Java学习资料+Java教程第23节+23-jquery对象与dom对象之间相互转化。

    jquery对象和javascript对象即DOM对象相互转换

    DOM对象就是Javascript 固有的一些对象操作。DOM 对象能使用Javascript 固有的方法,但是不能使用 jQuery 里的方法。例如:document.getElementById(“img”).src = “test.jpg”;这里的document.getElemen

    jQuery对象与DOM对象之间的相互转换

    1、jQuery对象转换成DOM对象 jQuery对象不能使用DOM中的方法,但如果对jQuery对象所提供的方法不熟悉,或者jQuery没有封装想要的方法,不得不使用DOM对象的时候,有以下两种处理方法: 1、jQuery对象是一个类似数组...

    JQUERY 对象与DOM对象之两者相互间的转换

    今天主要看看jQuery对象和dom对象的相互转换,明白了这个,以后用起jQuery会方便很多。 1、方法名冲突的解决办法 在开始使用jQuery时,我们首先应该避免jQuery与其他类库或自定义js的冲突。 先看一段最简单的代码: ...

    jQuery对象和DOM对象的相互转化实现代码

    jQuery对象和DOM对象相互转化 jQuery对象和DOM对象 jQuery对象就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法,但是不能使用DOM的方法;例如$(“#img”).attr(“src”...

    jquery对象和DOM对象的相互转换详解

    主要介绍了jquery对象和DOM对象的相互转换详解的相关资料,需要的朋友可以参考下

    jQuery对象与DOM对象之间的转换方法

    刚开始学习jQuery,可能一时会分不清楚哪些是jQuery对象,哪些是DOM对象。至于DOM对象不多解释,我们接触的太多了,下面重点介绍一下jQuery,以及两者相互间的转换。

    jQuery对象与DOM对象转换方法详解

    主要介绍了jQuery对象与DOM对象的转换方法,结合实例形式分析了jQuery对象及DOM对象的作用与二者的相互转换技巧,需要的朋友可以参考下

    jquery对象和DOM对象的任意相互转换

    什么是jQuery对象? —就是通过jQuery包装DOM对象后产生的...虽然jQuery对象是包装DOM对象后产生的,但是jQuery无法使用DOM对象的任何方法,同理DOM对象也不能使用jQuery里的方法.乱使用会报错。比如:$(“#test”).in

    牛叉的Jquery——Jquery与DOM对象的互相转换及DOM的三种操作

    2.jQuery对象和DOM对象的相互转换。 良好的书写风格: 复制代码 代码如下: var $input=$(“input”) jQuery获取的对象在变量前面加上$。 <1>jQUery对象转成DOM对象,两种方法:[index]和get(index) a:var $cr=

    jQuery对象和DOM对象相互转化

    DOM对象能使用Javascript固有的方法,但是不能使用jQuery里的方法。例如:document.getElementById(“img”).src=”test.jpg”;这里的document.getElementById(“img”)就是DOM对象;$(“#img”).attr(“src”,”...

    锋利的jQuery pdf + 示例代码

    《锋利的jQuery》适合所有对jQuery技术感兴趣的Web设计者和前端开发人员...1.4.2 jQurey对象和DOM对象的相互转换 13 1.4.3 实例研究 14 1.5 解决jQuery和其他库的冲突 16 1.6 jQuery开发工具和插件 18 1.7 小结 22

Global site tag (gtag.js) - Google Analytics