您的位置：首页 > Web前端 > JQuery

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

2016-09-05 14:08 756 查看

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

博客分类：
javascript

以前没注意过，认为jquery 中的 $("#air") 与 document.getElementById("air") 是一回事，指的是同一个东西。在今天写一个canvas的小程序时，才发现这两者是不一样的。

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

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8">

<title>air</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="air"></canvas>

</div>

<script>

var canvas_air=$("#air");

alert(canvas_air);

alert(document.getElementById("air"));

var air_2d=canvas_air.getContext("2d");

var air_img=new Image();

air_img.src="images/Boston-III-48px.png";

air_2d.drawImage(air_img,0,0);

</script>

</body>

</html>

两个alert()分别显示为：[object Object]和[object HTMLCanvasElement]。从这里，不难看出，$("#air")并没有像我预想的那样。再用firebug调试看一下，

$("#air")和document.getElementById("air")倒底是什么内容。调试结果如下：

$("#air") [canvas#air]

document.getElementById("air") canvas#air

想必，看到这里，不用我说，大家也会想到结果了。

实际上，$("#air")[0]等同于 document.getElementById("air");

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航