zoukankan      html  css  js  c++  java
  • DOM事件

    一、事件流

      事件流描述的是从页面中接收事件的顺序。

      1.事件冒泡

        即开始时由最具体的元素接收,然后逐级向上传播到较为不具体的节点(文档)。

      2.事件捕获

        不太具体的点应该早接收事件,而最具体的节点应该最后接收到事件。

        3.DOM事件流:包括三个阶段:事件捕获阶段、处于目标阶段和事件冒泡阶段。//IE9 Opera Firefox Chrome Safari都支持DOM事件流;IE8及更早版本不支持DOM事件流。

     二、事件处理程序

    //HTML事件处理程序
    <p id="para" title="cssrain demo!" onclick="test()" >test</p> <script>   function test(){     alert("test");   } </script>

      

    <p id="para" title="cssrain demo!">test</p> 
    <script> 
      function test(){ 
        alert("test"); 
      } 
    
      function pig(){ 
        alert("pig"); 
      } 
    
      window.onload = function(){ 
        document.getElementById("para").onclick = test; 
        document.getElementById("para").onclick = pig; 
      } 
    </script> 
    //如果按照上面的写法,我们只能输出第二个函数,此种方法无法在同一事件绑定多个函数
    //可以用addEventListener() attachEvent()方法实现此功能

      

    //element是元素对象,type是事件类型,handle是函数对象(不是函数名字)
    //兼容的事件处理程序 var EventUtil={ addHandle:function(element,type,handle){ if(element.addEventListener){ element.addEventListener(type,handle,false);  //适用于IE9 firfox safari chrome opera }else if(element.attachEvent){ element.attachEvent("on"+type,handle);    //适用于IE和Opera }else{ element["on"+type]=handle; } }, removeHandle:function(element,type,handle){ if(element.addEventListener){ element.removeEventListener(type,handle,false); }else if(element.attachEvent){ element.detachEvent("on"+type,handle); }else{ element["on"+type]=handle; } } }

      

  • 相关阅读:
    面试经验
    java常见面试题目(三)
    java常见面试题目(二)
    java常见面试题目(一)
    Java编程思想:第2章 一切都是对象
    汇编语言:第九章 转移指令的原理
    汇编语言: 实验七 寻址方式在结构化数据访问中的应用
    汇编语言:第八章 数据处理的两个基本问题
    汇编语言:实验六 实践课程中的程序
    汇编语言:第七章 更灵活定位内存地址的方法
  • 原文地址:https://www.cnblogs.com/happyLee/p/5059904.html
Copyright © 2011-2022 走看看