jQuery對象與DOM對象

透過一個簡單的例子，簡單區分下jQuery物件與DOM物件：

我們要取得頁面上這個id為imooc的p元素，然後為這個文字節點增加一段文字：「您好！透過慕課網學習jQuery才是最佳的途徑」，並且讓文字顏色變成紅色。

普通處理，透過標準JavaScript處理：

var p = document.getElementById('imooc');
p.innerHTML = '您好！通过慕课网学习jQuery才是最佳的途径';
p.style.color = 'red';

透過原生DOM模型提供的document.getElementById(“imooc”) 方法取得的DOM元素就是一個DOM對象，再透過innerHTML與style屬性處理文字與顏色。

jQuery的處理：

var $p = $('#imooc');$p.html('您好！通过慕课网学习jQuery才是最佳的途径').css('color','red');

透過$('#imooc')方法會得到一個$p的jQuery對象，$p是一個類別數組物件。這個物件裡麵包含了DOM物件的訊息，然後封裝了許多操作方法，呼叫自己的方法html與css，得到的效果與標準的JavaScript處理結果是一致的。

透過標準的JavaScript操作DOM與jQuery操作DOM的對比，我們不難發現：

透過jQuery方法包裝後的對象，是一個類別數組物件。它與DOM物件完全不同，唯一相似的是它們都能操作DOM。
透過jQuery處理DOM的操作，可以讓開發者更專注業務邏輯的開發，而不需要我們具體知道哪個DOM節點有那些方法，也不需要關心不同瀏覽器的兼容性問題，我們透過jQuery提供的API進行開發，程式碼也會更加精細。

本文解釋了jQuery物件與DOM物件內容，更多請關注php中文網。

相關建議： 

jQuery外掛程式開發標準寫法

#markdown基本語法與使用方法

#使用form、FormData進行的文件提交。

#

以上是jQuery對象與DOM對象的詳細內容。更多資訊請關注PHP中文網其他相關文章！