jQuery对象与DOM对象区别与联系
来源:互联网 发布:sql计算字段执行顺序 编辑:程序博客网 时间:2024/06/05 18:37
一、什么是DOM对象
所谓DOM,即Document Object Model(文档对象模型),每一个DOM都可以表示成一棵树,请看下面的代码,这是一个简单的网页基本结构。
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="gbk"> 5 <title>Document</title> 6 </head> 7 <body> 8 <p>这是一个段落</p> 9 <div id="test">这是一个div</div>10 </body>11 </html>
在上面的这颗DOM树中,所有的标签(如p, div等)组成的节点都称为DOM元素节点。我们可以通过javascript中的getElementsByTagName或者getElementById来获取元素节点。通过这种方式得到的DOM元素就是DOM对象。DOM对象可以使用javascript中的方法和属性来进行操作,例如:
1 var>//获取DOM对象2 var oDivHtml = oDiv.innerHTML; //获取div中的html内容
二、什么是jQuery对象
jQuery对象就是通过jQuery包装DOM对象后产生的对象。
jQuery对象是jQuery独有的,如果一个对象是jQuery对象,那么就可以使用jQuery里的任何方法。例如:(还是针对上面那段网页基本结构),我们可以使用:
1 $("#test").html();
来获取div中的html内容,这和上面通过DOM对象来获取div中的内容得到的最终结果是一样的。
但是需注意的是:在jQuery对象中无法使用任何DOM对象的方法。例如$("#test").innerHTML和$("#id").checked之类的写法都是错误的,可以用$("#test").html()和$("#id").attr("checked")之类的jQuery方法来代替。
当然,DOM对象也同样不能使用jQuery里的方法。例如document.getElementById(“id”).html()也会报错,只能用document.getElementByID(“id”).innerHTML语句。
三、jQuery对象和DOM对象的相互转换
1.DOM对象转换成jQuery对象
DOM对象转换成jQuery对象相对比较简单,这里放在前面说。对于一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。方式为$(DOM对象)。例如:
var oDom = document.getElementById("test2"); //DOM对象var oJquery = $(oDom); //转换成jQuery对象转换后,可以任意使用jQuery中的方法。
2.jQuery对象转成DOM对象
jQuery对象不能使用DOM中的方法,但如果对jQuery所提供的方法不熟悉,或者jQuery没有封装想要的方法,不得不使用DOM对象的时候,有以下两种处理方法。
jQuery提供了两种方法将一个jQuery对象转换成DOM对象,即[index]和get([index])。
(1)jQuery对象是一个数组对象,可以通过[index]的方法得到相应的DOM对象。例如:
1 var oCheckBox = $(".checkBox"); //jQuery对象2 var oDomCheckBox = oCheckBox[0]; //DOM对象3 alert(oDomCheckBox.checked); //弹出checkbox是否被选中(2)另一种方法是jQuery本身提供的,通过get(index)方法得到相应的DOM对象。例如
1 var oCheckBox = $(".checkBox"); //jQuery对象2 var oDomCheckBox = oCheckBox.get(0); //DOM对象3 alert(oDomCheckBox.checked); //弹出checkbox是否被选中
- jQuery DOM对象区别与联系
- jQuery对象与DOM对象区别与联系
- jQuery对象与dom对象的联系、区别和转换
- jQuery对象和DOM对象的区别与联系
- jQuery对象和DOM对象的区别与联系
- 系统学习jQuery.核心知识.FAQ.jQuery对象与DOM对象区别与联系
- jquery对象与dom对象的区别
- dom对象与jquery对象的区别
- jquery对象与dom对象的区别
- jQuery对象与dom对象的区别
- jQuery对象与DOM对象的区别
- jQuery对象与DOM对象的区别
- DOM对象与jQuery 对象区别
- Dom对象与jQuery对象的区别
- jQuery对象与dom对象的区别
- jQuery对象 与 js对象 区别与联系
- jquery与dom对象
- 通过jquery获取input的value问题--理解JQuery对象和JS:DOM对象区别与联系
- C程序编译执行过程
- JavaScript中的事件冒泡
- MFC Attach()函数和Detach()函数
- cmmi体系的精髓
- mysql工具命令
- jQuery对象与DOM对象区别与联系
- Spock和Groovy不兼容的问题解决
- 黑马程序员——Set集合
- C# 2008 学习笔记 - 扩展函数
- 10-排序-01-插入排序
- [Android设计模式]Android退出应用程序终极方法
- XMLHttpRequest对象和DOM对象
- 关于项目接口数据的对接
- java导入与导出excel,兼容excel2003以及excel2007