image
preventDefault()通知浏览器不要执⾏与事件关联的默认动作。
属性和⽅法描述stopPropagation()不再派发事件。
4.Event对象的⼀些兼容写法
[
image
](javascript:void(0);)
获得event对象兼容性写法
event || (event = window.event);
获得target兼容型写法
event.target||event.srcElement
阻⽌浏览器默认⾏为兼容性写法
event.preventDefault ? event.preventDefault() : (urnValue = false);
阻⽌冒泡写法
event.stopPropagation ? event.stopPropagation() : (event.cancelBubble = true);
[
image
](javascript:void(0);)
事件绑定和取消事件绑定⽅法的形式
[
image
](javascript:void(0);)
//事件绑定function on(dom, eventType, fn) {
if(dom.addEventListener) {
dom.addEventListener(eventType, fn);
} else {
if(dom.attachEvent) {
dom.attachEvent('on' + eventType, fn);
}
}
//取消事件绑定
function un(dom, eventType, fn) {
veEventListener) {
} else {
if(dom.detachEvent) {
dom.detachEvent("on" + eventType, fn)
}
}
}
[
image ](javascript:void(0);)
5.事件冒泡和事件捕获demo
[
image ](javascript:void(0);)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>bubble event</title>
<style type="text/css">
body{margin:0;}
one{
width:500px;
height:500px;
background:rgb(255,0,0);
border: 1px solid transparent;
}
two{
width:400px;
height:400px;
margin: 0 auto;
margin-top: 50px;
background:rgb(255,50,50);
border: 1px solid transparent;
}
three{
width:300px;
height:300px;
margin: 0 auto;
margin-top: 50px;
background:rgb(255,100,100);
border: 1px solid transparent;
html document是什么}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论