以防别人撞到…这是另一个不同之处:

如果id包含HTML标准不支持的字符(参见这里的SO问题)，那么即使getElementById可以找到它，jQuery也可能找不到它。

这发生在我的id包含“/”字符(例如:id=“a/b/c”)，使用Chrome:

var contents = document.getElementById('a/b/c');

能找到我的元素，但是

var contents = $('#a/b/c');

没有。

顺便说一句，简单的修复是移动id到名称字段。JQuery使用以下方法轻松找到元素:

var contents = $('.myclass[name='a/b/c']);

No.

调用document.getElementById('id')将返回一个原始DOM对象。

调用$('#id')将返回一个jQuery对象，该对象包装DOM对象并提供jQuery方法。

因此，只能在$()调用中调用css()或animate()等jQuery方法。

你也可以写$(document.getElementById('id'))，它将返回一个jQuery对象，等价于$('#id')。

你可以通过编写$('#id')[0]从jQuery对象中获得底层DOM对象。

jQuery是基于JavaScript构建的。这意味着它只是javascript。

document.getElementById ()

getelementbyid()方法返回具有指定值的ID属性的元素，如果不存在具有指定ID的元素则返回null。一个ID在一个页面中应该是唯一的。

Jquery(美元)

以id选择器作为参数调用jQuery()或$()将返回一个包含0个或1个DOM元素的集合的jQuery对象。每个id值在文档中只能使用一次。如果多个元素被分配了相同的ID，使用该ID的查询将只选择DOM中第一个匹配的元素。

不完全是! !

document.getElementById('contents'); //returns a HTML DOM Object

var contents = $('#contents');  //returns a jQuery Object

在jQuery中，获得与document相同的结果。getElementById，您可以访问jQuery对象并获得对象中的第一个元素(记住JavaScript对象的行为类似于关联数组)。

var contents = $('#contents')[0]; //returns a HTML DOM Object

接近，但不一样。它们得到相同的元素，但jQuery版本被包装在jQuery对象中。

等价的是这个

var contents = $('#contents').get(0);

或者这个

var contents = $('#contents')[0];

这将把元素从jQuery对象中拉出来。

不。第一个返回一个DOM元素或null，而第二个总是返回一个jQuery对象。如果没有匹配到id为contents的元素，jQuery对象将为空。

document.getElementById('contents')返回的DOM元素允许你做一些事情，比如改变. innerhtml(或.value)等，但是你需要在jQuery对象上使用jQuery方法。

var contents = $('#contents').get(0);

是更等价的，但是如果没有与内容id匹配的元素，document.getElementById('contents')将返回null，但$('#contents').get(0)将返回undefined。

使用jQuery对象的一个好处是，如果没有返回任何元素，也不会得到任何错误，因为对象总是返回的。但是，如果试图对document.getElementById返回的空值执行操作，将会得到错误