事件处理:
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对象的父元素