zoukankan      html  css  js  c++  java
  • JS_DOM事件温习

    先来复习一下DOM知识:

    事件冒泡:即事件最开始由最具体的元素接收,然后逐级向上传播,至最不具体的那个节点(文档)

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

    事件处理程序:

    HTML事件处理程序(缺点JS和HTML紧耦合,不易于维护,降低性能)

    DOM0级别事件处理程序(对这个我比较疑惑,有些资料有这个概念,有写资料没有这个概念,根据JS高级程序设计给出的它只能作为一个历史参考点)

    DOM1级事件处理程序

    DOM2级事件处理程序(能给一个元素重复定义多个相同事件的不同处理方法)[DOM2之前要自行添加代码实现]

    DOM3级事件处理程序

    还有IE事件处理程序(要对IE存在正确的仇视心理~)

    贴上一个跨浏览器的事件处理代码

     1 var eventUtils = {
     2 
     3     getEvent:function(event){
     4         return event?event:window.event;
     5     },
     6 
     7     getType:function(event){
     8         return event.type;
     9     },
    10 
    11     getTarget:function(event){
    12         return event.target || event.srcElement;
    13     },
    14 
    15     stopPropagation:function(event){
    16         if(event.stopPropagation){
    17             event.stopPropagation();
    18         }
    19         else{
    20             event.cancelBubble = true;
    21         }
    22     },
    23 
    24     preventDefault:function(event){
    25         if(event.preventDefault){
    26             event.preventDefault();
    27         }
    28         else{
    29             event.returnValue = false;
    30         }
    31     },
    32 
    33     addHandler:function(obj,method,fn){
    34         if(obj.addEventListener){
    35             obj.addEventListener(method,fn);
    36         }
    37         else if(obj.attachEvent){
    38             obj.attachEvent("on"+method,fn);
    39         }
    40         else{
    41             obj["on"+method] = fn;
    42         }
    43     },
    44 
    45     removeHandler:function(obj,method,fn){
    46         if(obj.removeEventListener){
    47             obj.removeEventListener(method,fn);
    48         }
    49         else if(obj.detachEvent){
    50             obj.detachEvent("on"+method,fn);
    51         }
    52         else{
    53             obj["on"+method] = null;
    54         }
    55     }
    56 }

    以上内容,如有错误请指出,不甚感激。

  • 相关阅读:
    毕业生的商业软件开发之路 C#语言简介
    [毕业生的商业软件开发之路]第一次使用VS.NET集成开发环境
    一种应用程序命令执行架构设计
    DCWriter 电子病历文档编辑器的 电子病历功能规范对照表
    [毕业生的商业软件开发之路]积累与创新
    WEB开发人员的微软技术战略
    PureMVC(AS3)剖析:吐槽
    走在网页游戏开发的路上(九)
    [服务器开发]可伸缩系统的设计模式(译)
    回合制页游
  • 原文地址:https://www.cnblogs.com/adelina-blog/p/5884311.html
Copyright © 2011-2022 走看看