浏览器默认行为:
如a标签会跳转;
组织这些默认行为
通用:
event.preventDefault();
IE:
event.returnValue=false;
兼容写法函数封装:
function stopDefault(event){
var e=event||window.event;
if(e.preventDefault){
e.preventDefault(); //标准浏览器
}else{
e.returnValue=false; //IE浏览器
}
}
事件监听(DOM二级事件):
设置事件
function addEvent(obj,inci,back){
if(obj.addEventListener){
obj.addEventListener(inci,back);
}else if(obj.attachEvent){
obj.attachEvent("on"+inci,back);
}else{ //如果以上两种都不支持则绑定一级事件
obj["on"+inci]=back;
}
}
移除事件
function removeEvent(obj,inci,back){
if(obj.removeEventListener){
obj.removeEventListener(inci,back,false);
}else if(obj.detachEvent){
obj.detachEvent("on"+inci,back);
}else{ //以上两种都无法移除事件,则直接设置为空
obj["on"+inci]=null;
}
}
事件委托:
其利用事件冒泡原理来实现,事件冒泡就是当事件从最深处触发时,会同时触发其祖先元素的事件。
利用这样的一个机制,给外层的元素添加一个点击事件,则它内部的元素被点击时,会冒泡到最外
层,这样一来都会触发,这就是事件委托。
好处便是能够减少DOM操作。
event对象提供了target属性,可以返回事件的目标节点,称为事件源