你的位置:首页 > Java教程

[Java教程]jQuery中的$()和javascript中的getElementById()之间的区别


jQuery的成功多归功于其强大的选择器。

然而,相信不少初学jQuery的同学都会遇到下面的问题。

在javascript下,我们可以根据getElementById()来获取页面元素。如下:

var oDiv1 = document.getElementById("divId");

用jQuery就方便多了:

var oDiv2 = $("#divId");

一般我们会认为,这两个东西返回的都是一个ID为"divId"的页面元素对象。但是事实上,这两种东西是不同的:

alert(oDiv1); //返回”[object HTMLDivElement]“alert(oDiv2); //返回”[object object]“

可以看出oDiv1确实是一个页面元素对象,但是oDiv2又是什么对象呢?

oDiv1.innerHTML = "111" ; //生效oDiv2.innerHTML = "111" ; //不生效,证明oDiv2不是指id为”divId“的页面元素

我们再通过浏览器控制台来看一下它们分别是什么:

> oDiv1< <div id="divId">> oDiv2< [<div id="divId">]

可以看出oDiv2其实是个数组对象!

事实上,jQuery选择器返回的都是数组对象,数组里面才会放置页面元素对象,而getElementById()返回的就是一个页面元素对象。

所以当我们要对像oDiv2进行操作的时候,就要这样:

oDiv1.innerHTML = "111" ; //生效oDiv2[0].innerHTML = "111" ; //生效//实际上 oDiv1 = oDiv2[0]