`
摩羯-008
  • 浏览: 4269 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

DOM对象与jQuery对象的区别

阅读更多
转:
初学jQuery,会对jQuery对象和DOM对象心存很大的疑惑,因此有必要明白他们之间的区别和联系。

DOM对象是我们用传统的方法(javascript)获得的对象,jQuery对象就是用jQuery的类库选择器获得的对象。JQuery对象就是通过jQuery包装DOM对象后产生的对象。JQuery对象是jQuery独有的,其可以使用jQuery里的方法,但是不能使用DOM的方法;

例如:

$("#color").html();//获取id为color的元素内的html代码,html()是jQuery特有的方法;
它等同于:
document.getElementById("color").innerHTML;

DOM对象就是javascript固有的一些对象。DOM对象能使用javascript固有的方法,但是不能使用jQuery里面的方法。

例如$("#id").innerHTML 和$("#id").checked之类的写法都是错误的,可以用$("#id").html()和$("#id").attr("checked")之类的 jQuery方法来代替。

var domObj =document.getElementById("id"); //DOM对象
var $obj =$("#id"); //jQuery对象;

jQuery对象和DOM对象的相互转换

jQuery对象转换成DOM对象

jquery提供了两种方法将一个jquery对象转换成一个dom对象,即[index]和get(index)。可能有人会觉得奇怪,怎么是用下标呢,没错,jquery对象就是一个数组对象.
下面代码将演示一个jquery对象转换成dom对象,再使用dom对象的方法

代码如下:

var$cr=$("#cr"); //jquery对象
var cr = $cr[0]; //dom对象 也可写成 var cr=$cr.get(0);
alert(cr.checked); //检测这个checkbox是否给选中

dom对象转换成jquery对象
对于一个dom对象,只需要用$()把dom对象包装起来,就可以获得一个jquery对象了,方法为$(dom对象);
复制代码 代码如下:

varcr=document.getElementById("cr"); //dom对象
var $cr = $(cr); //转换成jquery对象

转换后可以任意使用jquery中的方法了.
分享到:
评论

相关推荐

    jQuery简介、jQuery使用详解、DOM对象与jQuery对象的转换与区别

    本篇文章将深入探讨jQuery的基本概念、使用方法以及DOM对象与jQuery对象之间的转换与区别。 首先,我们从jQuery的简介开始。jQuery是由John Resig于2006年创建的,其目标是“write less, do more”。jQuery的核心...

    javascript 原生Dom对象和jQuery对象的联系和区别

    JavaScript中的DOM对象和jQuery对象是两种不同的数据结构,它们在处理网页元素时有着各自的特性和优缺点。了解它们之间的联系和区别对于JavaScript开发者来说至关重要,因为这有助于选择合适的工具进行网页交互。 ...

    dom对象与jquery对象转换[参考].pdf

    DOM对象和jQuery对象是JavaScript在处理网页元素时的两种不同表示方式。DOM(Document Object Model)是HTML和XML文档的标准模型,它将网页结构抽象成一个树形结构,每个节点代表一个HTML元素。jQuery是一个流行的...

    jquery dom对象 详细介绍1

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

    关于dom和jquery对象理解

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

    jquery对象和dom对象

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

    jquery对象和dom对象.doc

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

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

    在Web开发中,经常需要在jQuery对象和DOM对象之间进行转换,以便可以利用各自对象的方法优势进行高效编程。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对象和jQuery对象是前端开发中常见的两种对象类型,它们各有特点和用途,且可以互相转换,了解它们之间的差异和转换方法对于前端开发人员是非常重要的。 首先,DOM(文档对象模型)对象是浏览器提供的用于操作...

    jquery对象和DOM对象的区别介绍

    (http://shawphy.com/jqueryapi/ 这里是最新文档,有离线版下载) 第三步,深刻了解jQuery对象和普通DOM对象的区别。互相转化见Q1 Q1,js的写法:document.getElementById(‘save’).disabled=true; 在jquery中我是...

    jQuery学习笔记之DOM对象和jQuery对象

    jQuery对象与DOM对象之间可以相互转换: 1. **从jQuery对象获取DOM对象**: - 数组索引方式:`var domObj = $jQueryObj[0];` - `get()`方法:`var domObj = $jQueryObj.get(0);` 2. **从DOM对象转换为jQuery对象...

    jQuery第1天:JQ基本介绍、使用步骤、jQuery对象与DOM对象(重点)、jQuery选择器

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

    jquery技巧总结

    2、jQuery对象与dom对象的转换 只有jquery对象才能使用jquery定义的方法。注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是jquery对象。 普通的dom对象一般可以通过$()转换成jquery对象。

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

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

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

    jQuery对象不能使用DOM中的方法,但是如果对jQuery对象所提供的方法不熟悉,或者jQuery没有封装想要的方法,不得不实用DOM对象的时候,有以下两种处理方法。jQuery提供了两种方法将一个jQuery对象转换成DOm对象,即...

Global site tag (gtag.js) - Google Analytics