jQuery对象和DOM对象的区别

三、DOM对象和jQuery对象的区别
1、DOM对象(Document Object Model)文档对象模型

通过getElementsByTagName、getElementsById、getElementsByClassName方法得到的对象就是DOM对象

2、jQuery对象
」Query对象就是通过」Query包装DOM对象后产生的对象。
jQuery对象是jQuery独有的。如果一个对象是」Query对象,那么就可以使用jQuery里的方法。例如:

$("#foo").html();这段代码等同于:
document.getElementsById("foo").innerHTML();

注:1)在jQuery对象中无法使用DOM对象的任何方法。
       2)DOM对象无法使用jQuery对象中的任何方法。


3、DOM对象和jQuery对象相互转化
Var $variable = jQuery对象;(定义变量时前面加上$符号的就是jQuery对象
Var variable = jQuery对象;

1)两种方法将一个jQue甲对象转换成DoM对象,即[index]和get(index)。

eg.

var $cr = $("#cr"); //jQuery对象
var cr = $cr[0]; //DOM对象
var cr = $cr.get[0]; //DOM对象

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

var cr = document.getElementsById("cr"); //DOM对象
var $cr = $(cr); // $(DOM对象)得到一个jQuery对象
转换后可以任意使用jQuery对象中的方法。

实例:jQuery判断是否选中复选框

<input type="checkbox" id="cr" />
<label>我已经阅读了用户协议</label>

var $cr = $("#cr"); //jQuery对象
/* var cr = $cr[0]; //DOM对象*/
$cr.click (function(){
/* if(cr.checked){ //错误写法:cr.checked()
alert("DOM方式判断:复选框已选中!");
}*/
if($cr.is(":checked")){//返回值是boolean值
alert("jQuery方式判断:复选框已选中!");
}
});

没有人能一路单纯到底,但是要记住,别忘了最初的自己!
原文地址:https://www.cnblogs.com/LindaBlog/p/9790111.html