jQuery對象與DOM對象之間的轉換

什么是DOM對象

　　使用JavaScript中的方法獲取頁面中的元素返回的對象就是dom對象。比如使用document.getElement*系列的方法返回的就是dom對象。

var btn = document.getElementById("btnShowDiv"); var divs = document.getElementsByTagName("div"); 

　　dom對象只可以使用dom對象的方法和屬性

domObject.innerHTML = "dom對象設置文本"; domObject.style.display= "block";//dom對象顯示對象 domObject.onclick = function() {}//dom對象綁定事件 

什么是jQuery對象

　　jquery對象就是使用jquery的方法獲取頁面中的元素返回的對象就是jQuery對象。比如使用$()方法返回對象都是jquery對象。

$("div");//標簽選擇器返回的jquery對象。 $("#btnShowDiv");//id選擇器返回的jquery對象。 

　　jQuery對象只能使用jquery對象的方法

var $obj = $("div"); $obj.html("jquery對象設置文本的方法"); $obj.show();//jquery對象顯示文本 $obj.click(function() {});//jquery對象綁定事件 

錯誤的用法

$("div").innerHTML;//jquery對象不能調用dom方法 //dom對象不能調用jquery方法。 document.getElementById("btnShowDiv").show(); 

深入了解jQuery對象

jQuery對象其實就是DOM對象的包裝集（包裝了DOM對象的集合）

聯想記憶：衣服和洗衣機的關系

jQuery對象和DOM對象的相互轉換

1.jQuery對象轉DOM對象

var $li = $(“li”); //第一種方法（推薦使用） $li[0] //第二種方法 $li.get(0) //其實jQuery對象轉DOM對象的實質就是取出jQuery對象中封裝的DOM對象。 

2.DOM對象轉jQuery對象

聯想記憶：我有錢[美元]，所以我的功能就更強大。

var $obj = $(domObj); // $(document).ready(function(){});就是典型的DOM對象轉jQuery對象