理解jQuery物件 html

2021-07-29 19:33:42 字數 1490 閱讀 9780

說起jquery,最明顯的標誌,毫無疑問,就是美元符號$,美元符號$其實是jquery的簡寫。而使用$()包裝的物件就是jquery物件

與jquery物件相對應的就是dom物件,dom物件其實就是dom元素節點物件

如果直接寫document,則指的是document的dom元素物件

document.onclick = function

()

而如果用$()包括起來,如$(document),是jquery(document)的簡寫形式,則指的是jquery物件

[注意]jquery物件無法使用dom物件的方法,dom物件也無法使用jquery物件的方法

dom轉jquery物件

對於乙個jquery物件,只需要用$()把dom物件包裝起來,就可以獲得乙個jquery物件

jquery轉dom物件

jquery是乙個類陣列物件,可以通過[index]或get(index)的方法得到相應的dom物件

console.log(document === $(document)[0]);//

true

console.log(document === $(document).get(0));//

true

如果jquery物件和dom物件指向同一物件,繫結不同函式,則函式會按照順序依次執行

//

先彈出0,再彈出1

document.onclick = function

()$(document).click(

function

());

如果使用dom物件,為不存在的dom物件設定樣式會報錯

//uncaught typeerror: cannot read property 'style' of null

document.getelementbyid('test').style.color = 'red';

而使用jquery物件,為不存在的jquery物件設定樣式不會報錯

$('#test').css('color','red');
一般地,dom物件在使用之前需要判斷存在,防止出錯

if(document.getelementbyid('#test'))
對於jquery物件來說,因為$()獲取到的永遠是物件,即使網頁上沒有該元素。所以不能採用下面方式判斷

if

($(#test))

應該根據獲取到元素的長度來判斷

if

($(#test).length)

或者轉換成dom物件來判斷

if($(#test)[0])
最後要提一下jquery的版本問題。jquery從2.0版本開始不再支援ie8-瀏覽器,且去掉了一些過時的api,從而使體積更小,執行速率更高。所以,如果有相容ie8-瀏覽器的需求,需要使用jquery1.*版本

理解jQuery物件 html

說起jquery,最明顯的標誌,毫無疑問,就是美元符號 美元符號 其實是jquery的簡寫。而使用 包裝的物件就是jquery物件 與jquery物件相對應的就是dom物件,dom物件其實就是dom元素節點物件 如果直接寫document,則指的是document的dom元素物件 document....

Jquery物件和dom物件獲取html的方法

1 dom物件 var domobj document.getelementbyid id dom物件 domobj.innerhtml domobj.outerhtml 2 jquery物件 var obj id jquery物件 foo html 相當於dom物件的innerhtml obj.p...

Jquery物件 jquery與dom物件的區別

最近工作有很多判斷的 用到了jquery與dom物件的地方比較多,寫在這裡加強下基本概念 1.判斷是否存在時候,要用dom物件,因為jquery在獲得物件的時候,無論要獲得的物件是否存在,都會返回jquery物件 2.jquery物件與dom物件的轉換 jquery物件就是通過jquery包裝dom...