DOM物件與jQuery物件有什麼不同

jquery物件和dom物件使用說明，需要的朋友可以參考下。

1.jquery物件和dom物件

第一次學習jquery,經常分辨不清哪些是jquery物件，哪些是 dom物件，因此需要重點了解jquery物件和dom物件以及它們之間的關係.

dom物件，即是我們用傳統的方法(j**ascript)獲得的物件，jquery物件即是用jquery類庫的選擇器獲得的物件;

複製** **如下:

var domobj = document.getelementbyid("id"); //dom物件

var $obj = $("#id"); //jquery物件;

jquery物件就是通過jquery包裝dom物件後產生的物件，它是jquery獨有的。如果乙個物件是jquery物件，那麼就可以使用jquery裡的方法，例:

$("#foo").html(); //獲取id為foo的元素內的html**，html()是jquery特有的方法;

上面的那段**等同於:

document.getelementbyid("foo").innerhtml;

注意：在jquery物件中無法使用dom物件的任何方法。

例如$("#id").innerhtml 和$("#id").checked之類的寫法都是錯誤的，可以用$("#id").html()和$("#id").attr ("checked")之類的 jquery方法來代替。同樣，dom物件也不能使用jquery方法。學習jquery開始就應當樹立正確的觀念，分清jquery物件和dom物件之間的區別，之後學習 jquery就會輕鬆很多的。

2.jquery物件和dom物件的互相轉換

在上面第一點說了，jquery物件和dom物件是不一樣的！比如jquery物件不能使用dom的方法，dom物件不能使用jquery方法，那假如我 jquery沒有封裝我要的方法，那能怎麼辦呢？

這時我們可以將jquer物件轉換成dom物件

jquery物件轉換成 dom物件

jquery提供了兩種方法將乙個jquery物件轉換成乙個dom物件，即[index]和get(index)。可能有人會覺得奇怪，怎麼是用下標呢，沒錯，jquery物件就是乙個陣列物件.

下面**將演示乙個jquery物件轉換成dom物件，再使用dom物件的方法

複製** **如下:

var $cr=$("#cr"); //jquery物件

var cr = $cr[0]; //dom物件也可寫成 var cr=$cr.get(0);

alert(cr.checked); //檢測這個checkbox是否給選中

dom物件轉換成jquery物件

對於乙個dom物件，只需要用$()把dom物件包裝起來，就可以獲得乙個jquery物件了，方法為$(dom物件);

複製** **如下:

var cr=document.getelementbyid("cr"); //dom物件

var $cr = $(cr); //轉換成jquery物件

轉換後可以任意使用jquery中的方法了.

通過以上的方法，可以任意的相互轉換jquery物件和dom物件.

最後再次強調，dom物件才能使用dom中的方法，jquery物件不可以使用dom中的方法，但 jquery物件提供了一套更加完善的工具用於操作dom,關於jquery的dom操作將在後面的文章進行詳細講解.

ps: 平時用到的jquery物件都是通過$()函式製造出來的，$()函式就是乙個jquery物件的製造工廠.

建議:如果獲取的物件是 jquery物件，那麼在變數前面加上$,這樣方便容易識別出哪些是jquery物件,例如:

var $variable = jquery物件;

如果獲取的是dom物件，則定義如下:

var variable = dom物件

DOM物件與jQuery物件有什麼不同

Jquery物件 jquery與dom物件的區別

JQuery物件與DOM物件

Dom物件與Jquery物件

DOM物件與jQuery物件有什麼不同

Jquery物件 jquery與dom物件的區別

JQuery物件與DOM物件

Dom物件與Jquery物件

相關推薦