为了账号安全,请及时绑定邮箱和手机立即绑定
  • 第一章 事件流 1事件流 2事件处理程序 3事件处理类型 事件:文档或浏览器窗口中发生的特定的交互瞬间。【JavaScript <------>HTML】 事件流:描述的是从页面中接受事件的顺序 (IE:事件冒泡流 / Netscape事件捕获流) 事件冒泡流:即事件最开始由最具体的无素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播到最不具体的那个节点(文档) div-->HTML--->document 事件捕获:不太具体的节点应该更早接收到事件,而最具体的节点最后接收到事件。
    查看全部
    0 采集 收起 来源:[DOM] 事件捕获

    2018-03-22

  • 在触发DOM上的所有事件时都会产生一个名为event的事件对象,这个对象包含了事件类型,导致事件的元素以及其它相关信息,event中常用属性: type:事件的类型。如点击按钮(此按钮已经绑定了click事件),type=click target:获取事件目标。如点击按钮(此按钮已经绑定了click事件),target=button。ps:<input type="button">此时target=input。 stopPropagation()方法 阻止事件冒泡:DOM中冒泡是从最具体的元素开始接收,然后向上冒泡,也就是说浏览器会认为点击按钮时也点击了外层的元素 preventDefault()方法 阻止默认行为
    查看全部
  • IE事件处理程序:IE也提供了类似DOM2级事件处理程序 attachEvent()添加事件 detachEvent()删除事件 接收相同的两个参数:事件处理程序的名称和事件处理程序的函数。去掉了布尔值,不使用第三个参数的原因:IE8以及更早的浏览器版本只支持事件冒泡! 在IE下给btn3添加事件 btn3.attachEvent('onclick',showMes); 注意:在IE事件处理程序上,又要把on加上 btn3.detachEvent('onclick',showMes); 支持IE事件处理程序的浏览器主要有IE和Opera两个浏览器。 2.跨浏览器事件处理程序 var eventUtil = { //添加句柄 addHandler:function(element,type,handler){ if(element.addEventListener){element.addEventListener(type,handler,false);} // DOM2级事件处理程序 else if(element.attachEvent){element.attachEvent('on'+type,handler);} // IE事件处理程序 else{element['on'+type]=handler;} // DOM0级事件处理程序 }, //删除句柄 removeHandler:function(element,type,handler){ if(element.removeEventListener){element.removeEventListener(type,handler,false);} // DOM2级事件处理程序 else if(element.detachEvent){element.detachEvent('on'+type,handler);} // IE事件处理程序 else{element['on'+type]=null;} //DOM0级事件处理程序 } } eventUtil.addHandler(btn3,'click',showMessage); 3.js中所有用'.'的地方都可以使用'[]'如:对象的点击事件element.onclick===element['onclick']
    查看全部
  • 事件对象重要行为
    查看全部
  • DOM2级事件处理程序 定义了两个方法--用于处理指定和删除事件处理程序的操作: addEventListener()添加事件监听程序 removeEventListener()移除事件监听程序 三个参数设置;事件名称,处理方法(函数),布尔值--false:表示在冒泡阶段调用事件处理程序(可以最大限度的兼容浏览器),一般设为false;true表示在捕获阶段调用事件处理程序 btn3.addEventListener('click',showMes,false); 注意: 1、若事件名称有on,则需去掉on。onclick --> click,onmouseover --> mouseover等等; 2、false 最大限度兼容所有浏览器--事件冒泡流。 3.通过addEventListener添加的事件只能通过removeEventListener来删除。--参数要与添加事件时相同 btn3.removeEventListener(参数);//参数必须和btn.addEventListener的参数一致,删除事件监听 DOM0级和DOM2级事件处理程序可以给一个事件绑定多个函数,事件触发的时候会按照绑定顺序执行各个函数。如下所示: btn3.addEventListener('click',showMes,false); btn3.addEventListener('click',showMes,function(){alert(this.value);},false); 缺点:IE不支持该事件
    查看全部
  • 事件兼容 事件绑定:addEventListener与attachEvent 事件移除:removeEventListener与detachEvent 获取事件对象:e.target与 window.event.srcElement 阻止冒泡:e.stopPropagation与window.event.cancelBubble 阻止默认:e.preventDefault与window.event.returnValue
    查看全部
  • 事件对象
    查看全部
  • 事件对象,DOM IE
    查看全部
  • DOM中的事件对象: 1、type属性 获取时间类型 2、target属性 获取标签 3、stopPropagation()方法 阻止事件冒泡 4、preventDefault()方法 阻止默认行为
    查看全部
  • 键盘事件
    查看全部
  • stopPropagation() 阻止事件冒泡 preventDefault()阻止事件的默认行为 <a></a>
    查看全部
  • 4、IE事件处理程序 attachEvent() detachEvent()
    查看全部
  • 事件处理程序1、html事件处理程序2、doc0级事件处理程序3、doc2级事件处理程序 doc2级事件处理程序的两个方法1、addEventListener() 2、removeEventListener
    查看全部
  • 适用事件处理程序1、HTML事件处理程序2、DOC0级事件处理
    查看全部
  • 事件流:事件冒泡 事件捕获
    查看全部
    0 采集 收起 来源:[DOM] 事件捕获

    2016-04-26

举报

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

微信扫码,参与3人拼团

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

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