`

jquery对象与dom对象

阅读更多

什么是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第1天:JQ基本介绍、使用步骤、jQuery对象与DOM对象(重点)、jQuery选择器

    本篇文章将深入探讨jQuery的基础知识,包括其基本介绍、使用步骤、jQuery对象与DOM对象的区别,以及jQuery的选择器。此外,我们还将讨论`mouseover`与`mouseenter`事件的区别、`index()`方法的用法以及如何区分...

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

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

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

    本文实例分析了jQuery对象与DOM对象的转换方法。分享给大家供大家参考,具体如下: jQuery对象转换为dom对象 只有jQuery对象才能调用jQuery类库的各种函数,同样有些dom对象的属性和方法在jQuery上也是无法调用的,...

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

    总的来说,熟练掌握jQuery对象与DOM对象之间的转换,能够使你在处理JavaScript项目时更加得心应手,提高代码的灵活性和可读性。在实际工作中,根据需求灵活选择使用jQuery对象或DOM对象,可以优化代码性能,提高开发...

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

    总的来说,jQuery对象与DOM对象之间的转换是开发中常见的需求。掌握这种转换技巧能帮助你更好地利用这两个世界的优点,提升代码的可读性和效率。在编写jQuery代码时,一定要注意选择合适的方法,避免混淆两者,这样...

    jquery对象与DOM对象转化

    本文旨在深入探讨jQuery对象与DOM对象之间的转化技巧,通过这些方法可以实现两者的相互转换,从而在Web开发过程中更灵活地运用jQuery库和原生JavaScript。 首先,我们需要了解jQuery对象与DOM对象的基本区别。一个...

    jquery对象和dom对象

    DOM对象是JavaScript与HTML交互的基础,而jQuery对象通过封装DOM对象,提供了更为便利的操作接口。理解两者之间的关系和转换方法,对于提升JavaScript编程效率和代码质量具有重要意义。在实际项目中,灵活运用DOM...

    关于dom和jquery对象理解

    在实际开发中,有时需要在DOM对象与jQuery对象之间进行转换。虽然jQuery提供了一些便利的方法来操作DOM,但在某些情况下,我们仍然需要使用原生的DOM方法。 1. **从jQuery到DOM**:jQuery对象可以很容易地转换成DOM...

    jquery dom对象 详细介绍1

    ### 二、jQuery对象与DOM对象 - **DOM对象**:通过JavaScript原生方法如`getElementById()`获取的元素,可以调用DOM提供的所有属性和方法。 - **jQuery对象**:通过jQuery的选择器或者`$(...)`包裹的元素集合,...

    jquery对象和dom对象.doc

    当我们谈论jQuery对象和DOM对象时,我们需要理解两者之间的基本差异和转换方法。 DOM(Document Object Model)是HTML和XML文档的结构表示,允许我们通过JavaScript来访问和修改网页内容。DOM对象是通过JavaScript...

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

    在使用jQuery时,经常会遇到与DOM对象进行交互的情况,而jQuery对象与DOM对象之间的转换是必须要掌握的知识点,因为它们各自拥有不同的特性与方法。 首先,我们来理解什么是DOM对象。DOM(Document Object Model)...

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

    在前端开发中,经常需要在jQuery对象和DOM对象之间进行转换。这是因为它们各有优势,jQuery对象可以使用jQuery提供的各种便利方法,而DOM对象则可以使用原生JavaScript的所有属性和方法。理解这两种对象的区别及它们...

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

    在Web开发中,经常需要在jQuery对象和DOM对象之间进行转换,以便可以利用各自对象的方法优势进行高效编程。jQuery对象是包装了DOM对象的类数组对象,它们之间的转换虽然看似简单,但在实际操作中却非常重要。 首先...

    Jquery对象和Dom对象的区别分析

    反之,当需要对DOM对象使用jQuery的方法时,可以使用jQuery的包装函数$(),把DOM对象包装成jQuery对象,如$(DOM对象)。 3. jQuery对象与DOM对象的方法使用差异 在使用方面,jQuery对象和DOM对象有着明显的不同: ...

    Jquery+dom+easyUI教程

    6. jQuery 对象与 DOM 对象:理解两者之间的差异至关重要。jQuery 对象是通过 `$()` 函数创建的,包含了多个 DOM 元素,而 DOM 对象则是 JavaScript 的原生对象,代表单个 HTML 或 XML 元素。jQuery 对象可以通过 `...

Global site tag (gtag.js) - Google Analytics