为了账号安全,请及时绑定邮箱和手机立即绑定
  • 缺点:html代码和js代码耦合在一起了。
    查看全部
  • 最终的结果就是,放心大胆的使用事件冒泡吧!现在IE、chrome都支持了事件捕获。
    查看全部
    0 采集 收起 来源:[DOM] 事件捕获

    2016-08-17

  • button->div->body->html->document
    查看全部
    0 采集 收起 来源:[DOM] 事件冒泡

    2018-03-22

  • IE事件流是事件冒泡流;网景事件流是事件捕获流。
    查看全部
    0 采集 收起 来源:[DOM] 事件冒泡

    2016-08-17

  • 事件流,描述的是从页面中接受事件的顺序。
    查看全部
    0 采集 收起 来源:[DOM] 事件冒泡

    2016-08-17

  • 事件冒泡:最集体的--逐级传递到最不具体的 span -> div -> body ->html 时间捕获:最不具体的逐级传递到最具体的 html -> body -> div -> span
    查看全部
    0 采集 收起 来源:[DOM] 事件捕获

    2018-03-22

  • IE中的事件对象 1. type属性 事件类型 2. srcElement 获取事件目标 3. cancelBubble属性用于阻止事件冒泡(true表示阻止冒泡,false表示不阻止) 4 returnValue阻止事件默认行为(false阻止行为) getEvent:function(event){ //非IE:event IE:window.event return event?event:window.event; }, getType:function(event){ return event.type; //非IE与IE相同 }, getElement:function(event){ //非IE:event.target IE:event.srcElement return event.target event.srcElement; }, preventDefault:function(event){ //判断对象方法是否存在时,要将方法当做属性来判断[函数名后不加小括号:if(对象.方法函数)],很多方法没有返回值,即使有返回值也不一定是布尔值,当if(方法函数())时会出现不可预料的结果 if(event.preventDefault){ event.preventDefault(); //非IE方法处理 }else{ event.returnValue=false; //IE属性处理 } }, stopPropagation:function(event){ if(event.stopPropagation){ event.stopPropagation(); //非IE方法处理 }else{ event.cancelBubble=true; //IE属性处理 } }
    查看全部
  • 什么是事件对象?在触发DOM上的事件时都会产生一个对象 事件对象EVENT ①DOM中的事件对象 属性 (1)、type属性用于获取事件类型 (2)、target属性用于获取事件目标 (3)、stopPropagation()方法 用于阻止事件冒泡 (4)、preventDefault() 方法 阻止事件的默认行为 如果一个div里面有一个button,button和div都绑定了click事件,如果是事件冒泡,那么点击button的时候,首先触发button的处理函数,然后触发div的处理函数。(由内而外) 如果有时候不想冒泡,也就是不希望div的事件被触发,那么需要阻止事件冒泡。stopPropagation()方法 如果需要阻止a标签的默认属性跳转,可以使用阻止事件的默认行为preventDefault()方法 IE8以下事件对象(window.event) 1.事件类型:event.type 2.事件目标:event.target 3.阻止事件冒泡:event.cancelBubble = true 4.阻止默认事件:event.returnValue = false
    查看全部
  • var eventUtil={ //添加句柄 //支持DOM2级、IE、DOM0级 addHandler:function(element,type,handler){ if(element.addEventListener){ element.addEventListenter(type,handler,false); } else if(element.attachEvent){ element.attachEvent('on'+type,handler); }else{ element['on'+type]=handler; } }, //删除句柄 removeHandler:function(element,type,handler){ if(element.romoveEventListener){ element.romoveEventListenter(type,handler,false); } else if(element.detachEvent){ element.detachEvent('on'+type,handler); }else{ element['on'+type]=null; } } } } element.eventuntil(btn3,'click',message);
    查看全部
  • // 封装添加事件监听程序 function addEvent(ele, type, hander){ if(ele.addEventListener){ ele.addEventListener(type, hander, false); } else if(ele.attachEvent){ ele.attachEvent('on' + type, hander); } else { ele['on' + type] = hander; } }
    查看全部
    0 采集 收起 来源:编程练习

    2016-08-16

  • 有三种方法能够确定浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条)。 对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari: window.innerHeight - 浏览器窗口的内部高度 window.innerWidth - 浏览器窗口的内部宽度 对于 Internet Explorer 8、7、6、5: document.documentElement.clientHeight document.documentElement.clientWidth 或者 document.body.clientHeight document.body.clientWidt 拖拽->鼠标跟随 1、绑定鼠标点击事件 2、获取鼠标坐标:clientX clientY (所有浏览器都支持此属性) 3、为容器元素绑定onmousemove (表明可拖拽元素只在容器元素内可拖拽) 4、将拖拽元素设置成绝对定位 5、在onmousemove中改变拖拽元素的left、top (注意left、top的算法) 6、设置left、top限定,禁止元素拖出窗口 7、当前浏览器窗口宽度document.documentElement.clientWidth或document.body.clientWidth 8、拖拽元素绑定onmouseup事件,在此事件中注销onmousemove事件,完成元素拖拽的释放效果 注意可以把left、top理解成x轴、y轴
    查看全部
  • DOM0级程序处理
    查看全部
  • ul列表
    查看全部
  • 鼠标划过和离开的状态
    查看全部
  • 让div在页面范围内移动
    查看全部

举报

0/150
提交
取消
课程须知
1.你一定对HTML+CSS比较熟悉; 2.掌握一定的JS基础知识,尤其是函数封装、调用等知识。
老师告诉你能学到什么?
DOM事件具体相关知识,DOM事件的使用方法及应用!

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!