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

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

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

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 对象的更多信息，请参阅文档。另请查看文档.get()

当您使用 jQuery 获取 DOM 元素时，jQuery 对象返回包含对该元素的引用。当您使用像 一样的本机函数时getElementById，您将直接获得对元素的引用，而不是包含在 jQuery 对象中。

jQuery 对象是一个类似数组的对象，可以包含多个 DOM 元素：

var jQueryCollection = $("div"); //Contains all div elements in DOM

上面的行可以在没有 jQuery 的情况下执行：

var normalCollection = document.getElementsByTagName("div");

事实上，这正是当您传入一个简单的选择器（如div. 您可以使用以下get方法访问 jQuery 集合中的实际元素：

var div1 = jQueryCollection.get(0); //Gets the first element in the collection

当您在 jQuery 对象中有一个元素或一组元素时，您可以使用 jQuery API 中可用的任何方法，而当您拥有原始元素时，您只能使用本机 JavaScript 方法。

上个月我才刚刚开始玩 jQuery，我脑子里有一个类似的问题。到目前为止，您收到的所有答案都是有效且准确的，但非常准确的答案可能是这样的：

假设您在一个函数中，要引用调用元素，您可以使用this, 或$(this); 但有什么区别？事实证明，当您使用 时$(this)，您将包装this在一个 jQuery 对象中。好处是一旦对象成为 jQuery 对象，您就可以在其上使用所有 jQuery 函数。

它非常强大，因为您甚至可以将元素的字符串表示，var s = '<div>hello <a href='#'>world</a></div><span>!</span>', 包装在 jQuery 对象中，只需将其直接包装在 $(): 中即可$(s)。现在您可以使用 jQuery 操作所有这些元素。

大多数 jQuery 成员Functions没有返回值，而是返回当前jQuery Object或另一个jQuery Object.

所以，

console.log("(!!) jquery >> " + $("#id") ) ; 

将返回[object Object]，即 ajQuery Object维护集合，该集合是针对 评估选择器String( "#id") 的结果Document，

尽管 ，

console.log("(!!) getElementById >> " + document.getElementById("id") ) ;

将返回[object HTMLDivElement]（或实际上[object Object]在 IE 中），因为/如果返回值是div Element.

还有哪些方法可以对 jQuery 对象和 DOM 元素进行操作？(1) 单个 jQuery 对象能否代表多个 DOM 元素？(2)

(1) FunctionjQuery 中有许多与 DOM 相关的成员Object。imo 最好的做法是在Function您完成特定任务（例如选择Nodes 或操作它们）后搜索相关的 jQuery API 文档。

• jQuery 文档

(2) 是的，单个jQuery Object可以维护多个 DOMElement的列表。有多个Functions（例如jQuery.find或jQuery.each）建立在这种自动缓存行为上。

那只是你的浏览器很聪明。它们都是对象，但 DOMElements 是特殊对象。jQuery 只是将 DOMElements 包装在一个 Javascript 对象中。

如果您想获得更多调试信息，我建议您查看调试工具，例如 Firebug for Firefox 和 Chrome 的内置检查器（与 Firebug 非常相似）。