jquery中的 $("#**")与document.getElementById("**") 的区别

原文网址:http://www.jb51.net/article/27800.htm

直接用alert()来显示这两个方法倒底获得的是什么。代码如下:

<!DOCTYPE HTML> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>jb51</title> 
<link href="css/index.css" rel="stylesheet" type="text/css"> 
<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script> 
</head> 
<body> 
<div class="warp"> 
<canvas id="jb51"></canvas> 
</div> 
<script> 
var canvas_jb51=$("#jb51"); 
alert(canvas_jb51); 
alert(document.getElementById("jb51")); 
var jb51_2d=canvas_jb51.getContext("2d"); 
var jb51_img=new Image(); 
jb51_img.src="images/Boston-III-48px.png"; 
jb51_2d.drawImage(jb51_img,0,0); 
</script> 
</body> 
</html> 

两个alert()分别显示为:[object Object]和[object HTMLCanvasElement]。从这里,不难看出,$("#jb51")并没有像我预想的那样。再用firebug调试看一下,
$("#jb51")和document.getElementById("jb51")倒底是什么内容。调试结果如下: 

$("#jb51") [canvas#jb51] 
document.getElementById("jb51") canvas#jb51 

想必,看到这里,不用我说,大家也会想到结果了。
实际上,$("#jb51")[0]等同于 document.getElementById("jb51")  

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。