javascript - jQuery 对象和 DOM 元素

Question

我想了解 jQuery 对象和 DOM 元素之间的关系..

当 jQuery 返回一个元素时，它在警报中显示为 [object Object]。当 getElementByID 返回一个元素时，它显示为 [object HTMLDivElement]。这到底是什么意思？我的意思是它们都是有区别的对象吗？

还有哪些方法可以对 jQuery 对象和 DOM 元素进行操作？一个 jQuery 对象可以表示多个 DOM 元素吗？

Answer 1

I would like to understand relationship between jQuery object and DOM element

jQuery 对象是包含 DOM 元素的类数组对象。一个 jQuery 对象可以包含多个 DOM 元素，具体取决于您使用的选择器。

Also what methods can operate on jQuery object vs DOM element? Can a single jQuery object represent multiple DOM elements ?

jQuery 函数(完整列表在网站上)对 jQuery 对象而不是 DOM 元素进行操作。您可以使用 .get() 或直接访问所需索引处的元素来访问 jQuery 函数内的 DOM 元素:

$("selector")[0] // Accesses the first DOM element in this jQuery object
$("selector").get(0) // Equivalent to the code above
$("selector").get() // Retrieve a true array of DOM elements matched by this selector

换句话说，以下应该得到相同的结果:

<div id="foo"></div>

alert($("#foo")[0]);
alert($("#foo").get(0));
alert(document.getElementById("foo"));

有关 jQuery 对象的更多信息，see the documentation .另请查看 .get() 的文档