jQuery事件處理,節點
事件處理:
1、頁面載入後的執行
類似於window.onload 但不同於 window.onload
jQuery載入後執行的特點:
在DOM樹載入完畢的時候就開始執行
$(document).ready( function(){
//頁面的初始化操作
//DOM樹載入完成後就開始執行
} );
$().ready( function(){
//頁面的初始化操作
//DOM樹載入完成後就開始執行
} );
$( function(){
//頁面的初始化操作
//DOM樹載入完成後就開始執行
} );
2、jQuery的事件繫結
方式1
$obj.bind("事件名稱",事件處理函式);
ex:
$obj.bind("click",function(){
//事件的行為操作
console.log("... ....");
});
方式2
$obj.事件名稱(function(){
//事件處理函式
});
ex:
$obj.click(function(){
//通過 this 來表示觸發該事件的DOM物件
});
3、事件物件 - event
在繫結事件的時候,允許傳遞 event 引數來表示事件物件
$obj.bind("click",function(event){
//event表示當前事件的事件物件
});
$obj.click(function(event){
//event表示當前事件的事件物件
});
event的使用方式與原生JS事件中的event使用方式一致。
event.stopPropagation() : 阻止事件冒泡
event.offsetX:
event.offsetY:
event.target:獲取事件源
節點:
1、children() / children("selector")
獲取某jQuery物件的所有子元素 或 帶有指定選擇器的子元素
注意:只考慮子代元素,不考慮後代元素
2、next() / next("selector")
獲取某jQuery物件的下一個兄弟元素 / 滿足selector的下一個兄弟元素
3、prev() / prev("selector")
獲取某jQuery物件的上一個兄弟元素 / 滿足selector的上一個兄弟元素
4、siblings() / siblings(selector)
獲取某jQuery物件的所有兄弟元素 / 滿足selector的所有兄弟元素
5、find("selector")
查詢滿足selector選擇器的所有後代元素
6、parent()
查詢某jQuery物件的父元素