Posted in Javascript onJuly 26, 2011
在今天写一个canvas的小程序时，才发现这两者是不一样的。
直接用alert()来显示这两个方法倒底获得的是什么。代码如下：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>3water</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="3water"></canvas>
</div>
<script>
var canvas_3water=$("#3water");
alert(canvas_3water);
alert(document.getElementById("3water"));
var 3water_2d=canvas_3water.getContext("2d");
var 3water_img=new Image();
3water_img.src="images/Boston-III-48px.png";
3water_2d.drawImage(3water_img,0,0);
</script>
</body>
</html> 两个alert()分别显示为：[object Object]和[object HTMLCanvasElement]。从这里，不难看出，$("#3water")并没有像我预想的那样。再用firebug调试看一下，
$("#3water")和document.getElementById("3water")倒底是什么内容。调试结果如下：
$("#3water") [canvas#3water]
document.getElementById("3water") canvas#3water 想必，看到这里，不用我说，大家也会想到结果了。
实际上，$("#3water")[0]等同于 document.getElementById("3water")
jquery中的 $("#jb51")与document.getElementById("jb51") 的区别
声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@