jQuery对象和DOM对象之间的转换实现

标签: WEB开发 编程开发 DOM jQuery | 发表时间:2015-03-01 21:46 | 作者:codeceo
出处:http://www.codeceo.com

本文主要向大家介绍了jQuery对象和DOM对象之间互相转换的方法,其实转换过程十分简单,一起来看看吧。

在讨论jQuery对象和DOM对象的相互交换之前,先约定好定义变量的风格。如果获取的对象是jQuery对象,那么在变量前加上$,例如:

var $variable = jQuery对象;

如果获取的是DOM对象,则定义如下:

var variable = DOM对象;

1.jQuery对象转成DOM对象

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

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

jQuery代码如下:

var $cr = $("#cr"); //jQuery对象
var cr = $cr[0] //DOM对象
alert(cr.checked) //检测这个checkbox是否选中了

(2)另一种方法是jQuery本身提供的,通过get(index)方法得到相应的DOM对象。

jQuery代码如下:

var $cr = $("#cr");
var cr = $cr.get(0);
alert(cr.checked)

2.DOM对象转换成jQuery对象

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

jQuery代码如下:

var cr = document.getElementByID("cr"); //DOM对象
var $cr = $(cr);

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

通过以上方法,可以任意地相互转换jQuery对象和DOM对象。

最后强调,DOM对象才能使用DOM中的方法,jQuery对象不可以使用DOM中的方法,但jQuery对象提供了一套更加完善的工具用于操作DOM。

相关 [jquery 对象 dom] 推荐:

jQuery对象和DOM对象之间的转换实现

- - 码农网
本文主要向大家介绍了jQuery对象和DOM对象之间互相转换的方法,其实转换过程十分简单,一起来看看吧. 在讨论jQuery对象和DOM对象的相互交换之前,先约定好定义变量的风格. 如果获取的对象是jQuery对象,那么在变量前加上$,例如:. var $variable = jQuery对象;. 如果获取的是DOM对象,则定义如下:.

jquery和DOM比较

- - JavaScript - Web前端 - ITeye博客
1、window.onload和$(document).ready()的区别. 必须等整个网页中所有的内容加载完毕后(包括图片)才能执行. 网页中所有DOM结构绘制完毕后就执行,可能DOM元素并没有加载完. 2、jquery对象和DOM对象的区别. Juery对象是包装DOM后的产生的对象,DOM是原生对象,是一个基本的文档结构.

前端学习——选择结果为JQuery对象还是DOM对象?

- - CSDN博客Web前端推荐文章
0.前言     在学习和使用javascript过程中经常使用JQuery的选择器,但是在获取到选择结果之后经常“犯迷糊”,需要一个DOM对象时或者一个JQuery对象,这样的尴尬经常遇到. 为了让自己不再迷糊通过博文总结经验教训,希望自己在总结过程中缓慢提高.     【 前端学习——如何修改url name 使用javascript和JQuery】.

jQuery基础之jQuery的DOM操作

- - CSDN博客推荐文章
 为了能全面地讲解DOM操作,首先需要构建一个网页. 因为每一张网页都能用DOM表示出来,而每一份DOM都可以看作一棵DOM树.    

你最喜欢的水果是?

 .      
  • 苹果
  •  .      
  • 橘子
  •  .

    Dom和jQuery的反选和全选比较

    - - CSDN博客推荐文章
    Dom和jQuery的反选和全选比较. 全选的思路是:当点击某个复选框或按钮的时候,可能会触发的有两种可能,可以是全选或者是全不选,所以要做一下判定,然后根据是全选或者是全不选来设定属性值. 反选的思路是:当点击某个复选框或按钮是,把没有选中的选中,选中的让它处于不选的状态.             你爱好的运动是:
    .

    jQuery的deferred对象详解

    - 郑小东 - 阮一峰的网络日志
    jQuery的开发速度很快,几乎每半年一个大版本,每两个月一个小版本. 今天我想介绍的,就是从jQuery 1.5.0版本开始引入的一个新功能----deferred对象. 这个功能很重要,未来将成为jQuery的核心方法,它彻底改变了如何在jQuery中使用ajax. 为了实现它,jQuery的全部ajax代码都被改写了.

    jquery获取对象大全

    - - CSDN博客Web前端推荐文章
    1、JQuery的核心的一些方法 . $("Element").length; ‘元素的个数,是个属性 . $("Element").size(); ’也是元素的个数,不过带括号是个方法 . $("Element").get(); ‘某个元素在页面中的集合,以数组的形式存储 . $("Element").get(index); ’功能和上面的相同,index表示第几个元素,数组的下标 .

    jQuery参考实例 1.2 在DOM加载完毕,页面元素完全加载之前运行jQuery/JavaScript代码

    - - CSDN博客推荐文章
    本文翻译自jQuery Cookbook (O’Reilly 2009) 1.2 Executing jQuery/JavaScript Code After the DOM Has Loaded but Before Complete Page Load. 主流的JavaScript应用程序一般只在DOM完全加载后才运行JS代码.

    避免DOM对象内存泄漏的使用准则

    - johnny - W3C标准WEB前端DHTML精英俱乐部
    终于,整理了一下在WEB前端脚本开发时因DOM对象造成的内存泄漏原因及解决方案. 避免DOM对象内存泄漏的使用准则. 取自DOM元素的DOM对象,添加属性时,属性值不能是与该DOM对象同作用域下声明的函数,如:a.b=function(){};". 如果该DOM对象被其他对象(如:b)引用,该DOM对象的属性值不能包含有对象b,如:b.push(a);a.b=b;.

    DOM详解

    - - CSDN博客推荐文章
     1.XML解析方式分为两种:dom和sax.   (1)dom:(Document Object Model, 即文档对象模型) 是 W3C 组织推荐的处理 XML 的一种方式.   (2) sax:(Simple API for XML) 不是官方标准,但它是 XML 社区事实上的标准,几乎所有的 XML 解析器都支持它.