当前位置:首页 > 开发 > Web前端 > Jquery > 正文

Jquery对象和DOM对象之间的转换

发表于: 2014-09-01   作者:wjiaoling136   来源:转载   浏览:
摘要: 在 JS 中, DOM 对象只能操作 DOM 中的方法, Jquery 对象只能操作 Jquery 中的方法,但有时候相应的对象中没有封装想要的方法或者不得不使用其他对象中的方法,就需要将两个对进行互相转换了。   Jquery转换成DOM对象: Jquery中提供了两种方法将一个Jquery对象转换成DOM,即:[index]和get(index)。 1)[indx]方法:Jq
JS 中, DOM 对象只能操作 DOM 中的方法, Jquery 对象只能操作 Jquery 中的方法,但有时候相应的对象中没有封装想要的方法或者不得不使用其他对象中的方法,就需要将两个对进行互相转换了。

 

Jquery转换DOM对象:

Jquery中提供了两种方法将一个Jquery对象转换成DOM,即:[index]get(index)

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

var $obj = $(this);//Jquery对象

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

alert($obj+”\n”+obj);//alert出对象类型,如果是Jquery对象,则是”Object”,如果是DOM对象,则是“HTMLObject”

 

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

var $obj = $(this);//Jquery对象

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

alert($obj+”\n”+obj);

 

两个实例:

1、  判断对象是否存在:

有时候定了一个Jquery之后,譬如说var $obj=$(“#cs”);可能这个IDcs的对象并不存在,但是alert($obje);却依然会提示说是个”Object”,在用的时候又会报错说不支持该对象或方法了,此时就需要判断该对象是否存在了。可以将Jquery对象转换成DOM对象,然后alert(obj),如果当前对象不存在,则会弹出”undefined”而不是”HTMLObject”。因为$(obj)本身就不存在,取其第一个对象必然也不存在了,就好比Java中“空指针,对象本身就为空,再取其属性值,必然也是个空。

当然判断对象是否存在,还可以用$obj.length();Jquery对象本来就是个数组对象,必然存在length,若length=0,那么当前对象必然不存在。

 

2、判断复选框是否选中:

Jquery对象中,可以通过attr(“checked”)来判断当前复选框是否选中(当然也可以使用$obj.is(“:checked”)来判断,这个返回的是boolean),但这个方法返回的值跟使用的Jquery库和浏览器的类型是有关系的,可能因为库或浏览器的不同,返回不同的值,如true/falsecheckedundefined、或者是空,如果判断不到位就获取不到当前复选框的状态。此时可以用DOM对象的checked属性。这个跟Jquery没有关系,浏览器解析的结果不是true就是false,很容易判断。

var $obj=$(“#cs”);

var obj = $obj[0];

alert($obj.attr(“checked”));

alert(obj.checked);

 

DOM对象转换成Jquery对象:

在平常使用中,用到的Jquery对象都是通过$()函数制造出来的,$()函数就是一个Jquery对象的制造工厂,所以,DOM对象要转换成Jquery对象,只需要用$()DOM对象包装起来,就可以得到一个Jquery对象。

var obj = document.getElementById(“id”);

var $obj = $(obj);

alert(obj+” \n” +$(obj));

Jquery对象和DOM对象之间的转换

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
本文主要向大家介绍了jQuery对象和DOM对象之间互相转换的方法,其实转换过程十分简单,一起来看看吧
一.摘要 本章讲解jQuery最重要的选择器部分的知识. 有了jQuery的选择器我们几乎可以获取页面上任意
<script type="text/javascript" src="jquery-1.4.4.js"></script> <title>Docum
下面介绍jquery对象和DOM对象的相互转换: 在使用jquery框架进行处理时,当我们使用$(expression)方
在第一次学习jquery中,常常会不能分辨DOM对象和Jquery对象,下面我们就简诉一下它们之间的关系和区
Dom对象 在传统的JavaScript开发中,我们经常都是首先获取Dom对象,比如: document.getElementById("d
前言: 在正式进入jQuery的各个细节之前,首先了解一下jQuery 对象和DOM对象,这是2个极容易搞混淆
http://www.imooc.com/code/3412 关于jQuery对象的包装 var $UL = $("#ul"); 通过对sizzle的分析,
http://www.imooc.com/code/3412 关于jQuery对象的包装 var $UL = $("#ul"); 通过对sizzle的分析,
DOM 对象 一、DOM简述 DOM—Document Object Model, 它是W3C国际组织的一套Web标准。它定义了访问HT
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号