jquery 中的 $("#id") 与 document.getElementById("id") 的区别
以前没注意过，认为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="data: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");
jquery 中的 $("#id") 与 document.getElementById("id") 的区别的更多相关文章
- function $(id) { return typeof id === "string" ? document.getElementById(id) : id; }
function $(id) { return typeof id === "string" ? document.getElementById(id) : id; } 这句代 ...
- jquery中的$("#id")与document.getElementById("id")的区别
以前一直认为jquery中的$("#id")和document.getElementByIdx_x("id")得到的效果是一样的,今天做特效的时候才发现并不是这 ...
- function $(id){ return document.getElementById(id); }导致所有的js不能用解决办法。。。。
function $(id){ return document.getElementById(id); } document.getElementById(id) 是获得id这个元素的. 相当于定义了 ...
- jQuery中，$('#main') 与 document.getElementById('main')是什么样的关系-转
$('#main')[0]和document.getElementById('main')两个一模一样.解释:$('#main'):是一个jquery写法,#main是一个过滤器表示方法,表示查找一个 ...
- 封装document.getElementById(id)
CreateTime--2016年12月18日11:42:45Author:Marydon封装document.getElementById(Id)方法 <script type=" ...
- document.getElementById("id").value与$("#id").val()之间的区别
本文链接:https://blog.csdn.net/mottohlm/article/details/78364196....今天在项目中遇到这么一个JS报错:原因是代码中有这么一段:对,就是var ...
- 获得输入框的文本document.getElementById('id').value;
<input id="demo" type="text" value="" > x=document.getElementByI ...
- document.getElementById(“id”)与$("#id")的区别
document.getElementById("id")可以直接获取当前对象, jQuery利用$("#id")获取的是一个[object Object],需 ...
- Id.value与document.getElementById("Id").value的区别
如果标签Id在Form表单里面的话,直接Id.value就不能用了,而是要用Form.Id.value来取值或设置值 所以最好用document.getElementById("Id&quo ...
随机推荐
- Android Studio-ApplicationId 与 PackageName
BuildType 中所设置的『applicationIdSuffix』属性,按照这个属性的字面翻译为:『applicationId 的后缀』 Android 应用都有自己的包名.包名是设备上每个应用 ...
- Systemd 入门教程：命令篇
http://www.ruanyifeng.com/blog/2014/09/illustration-ssl.html
- careercup-排序和查找 11.3
11.3 给定一个排序后的数组,包含n个整数,但这个数组已被旋转很多次,次数不详.请编写代码找出数组中的某个元素.可以假定数组元素原先是按从小到大的顺序排序的. 解法: 可以直接从开始一个一个比较,也 ...
- kali2.0如何安装中文输入法
由于kali的更新源是国外网站,替换成国内的镜像站,具体操作如下: 打开终端输入 leafpad /etc/apt/sources.list 把下面的源粘贴进去,原有内容注释掉 #中科大源deb ...
- HDU-1060(简单数学)
Leftmost Digit Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) P ...
- iframe父子窗口取值
父窗口中操作iframe:window.frames["iframeChild"].document //假如iframe的id为iframeChild 在子窗口中操作父窗口:wi ...
- order by跟group by 跟having（2）
- Sql面试常考题(持续添加)
最近萌生换工作的念头,于是上网下载了一些公司的面试题,重新看了面试题中的Sql部分,这些查询题有时候只是兜一个弯角来考,对于给EF惯坏的孩子来说还是有点难度的(给面试官鄙视了几下的结果),所以列出最近 ...
- 20151211jquery ajax进阶代码备份
//数据处理 $('form input[type=button]').click(function() { //json处理 /*$.ajax({ type:'POST', url:'test.js ...
- 20151215jquery学习笔记--jqueryUI --dialog（对话框）
对话框(dialog),是 jQuery UI 非常重要的一个功能.它彻底的代替了 JavaScript 的 alert().prompt()等方法,也避免了新窗口或页面的繁杂冗余 一．开启多个 di ...