# JavaScript DOM 對象與 jQuery 對象 > 原文： [https://howtodoinjava.com/jquery/javascript-dom-objects-vs-jquery-objects/](https://howtodoinjava.com/jquery/javascript-dom-objects-vs-jquery-objects/) 用一句話，DOM 對象是 Web 瀏覽器用來在網頁上呈現元素的對象，而 jQuery 對象基本上是圍繞一組 DOM 元素的包對象。 如果您想詳細了解這些對象以及如何使用它們，并相互轉換，然后繼續閱讀本教程。 ```java Table of Contents What are JavaScript DOM objects? What are jQuery objects? How to determine Whether an Object is DOM or jQuery? Convert an Object from DOM to jQuery and back ``` ## 什么是 JavaScript DOM 對象？ 如前所述，瀏覽器直接使用 DOM 對象在瀏覽器窗口中呈現網頁。 瀏覽器從 Web 服務器接收 HTML 文檔，它只是文本。 瀏覽器繼續將此文本解析為一個內部結構，該結構實際??上可以用來可視化呈現頁面。 DOM 表示瀏覽器具有 HTML 文檔的內部結構。 **DOM 對象表示頁面上的視覺或功能對象，該對象是從原始 HTML 文檔**創建的。 即使瀏覽器完全渲染了網頁，您也可以使用 JavaScript 更改 DOM 對象， [**屬性**](https://www.w3schools.com/jsref/dom_obj_all.asp)和值。 以這種方式進行的任何更改都會自動刷新瀏覽器窗口中顯示的視覺表示。 使用 DOM 對象的**優勢**在于，您可以直接訪問處理 HTML 元素所需的所有內容。 DOM 對象**的**缺點是，大多數附加的函數和屬性都是瀏覽器需要的，在使用 JavaScript 時不一定有用。 至少對于經驗不足的開發人員而言，這會使與他們的合作變慢一些。 例如，要更改段落或標簽的內容，可以使用如下所示的 javascript： ```java document.getElementById("label_firstname").innerHTML = "First Name"; ``` ## 什么是 jQuery 對象？ jQuery 對象是圍繞單個或多個 DOM 元素的包對象。 jQuery 對象（盡管從技術上講還是 JavaScript 對象）提供對包的 DOM 元素的訪問 - 但是，這是一種非常不同，更容易且通常更有效的方式。 請記住，jQuery 對象可以表示單個 DOM 對象，也可以表示許多 DOM 對象的集合。 因此，如果將操作應用于 jQuery 對象，則該操作可能適用于許多 DOM 對象。 使用 jquery 對象有其自身的優勢。 例如，jQuery 提供了許多有用的[**庫方法**](https://api.jquery.com/category/manipulation/)來搜索它所表示的 DOM 元素內的元素，并對所搜索的元素執行批量操作，而無需在代碼中對其進行迭代。 例如，要更改段落或標簽的內容，可以使用 jQuery，如下所示： ```java ("#label_firstname").html("First Name"); ``` ## 如何確定對象是 DOM 還是 jQuery？ 很多時候，在任何復雜的應用上工作時，您都可以在單個代碼中找到 jQuery 對象和 javascript DOM 對象。 現在您不確定是 jQuery 對象，DOM 對象還是其他 JavaScript 對象。 有一個簡單的方法可以分辨出差異。 要**確認對象是否為 jQuery 對象**，請查看該對象是否具有`jquery`屬性： ```java if( obj.jquery ) { //other operation } ``` 類似地，要確認**對象是否為 DOM 對象**，請查看該對象是否具有`nodeType`屬性： ```java if( obj.nodeType ) { //other operation } ``` ## 將對象從 DOM 轉換為 jQuery 并返回 在上述情況下，如果要將對象從 DOM 轉換為 jQuery 或將 jQuery 轉換為 DOM，可以使用以下技術來實現。 #### 將 DOM 對象轉換為 jQuery 對象 `$()`或`jquery()`方法從 DOM 對象創建一個新的 jQuery 對象。 ```java var jqueryObj = $(domObj); ``` #### 將 jQuery 對象轉換為 DOM 對象 `.get()`方法返回包在 jQuery 對象中的 DOM 對象。 ```java var domObj = jqueryObj.get(); ``` 這就是有關 javascript DOM 對象和 jQuery 對象的全部內容。 如果有任何問題或建議，請留下我評論。 學習愉快！