美文网首页
DOM事件处理模型—事件冒泡,捕获

DOM事件处理模型—事件冒泡,捕获

作者: ticktackkk | 来源:发表于2020-01-21 15:39 被阅读0次

事件冒泡
结构上(非视觉上),嵌套关系的元素,会存在事件冒泡的功能,即同一事件上,自子元素冒泡向父元素(自底向上)
阻止事件冒泡

div.onclick = function(e){ 传一个参数e,以便自己使用
    e.stopPropagation();阻止
    e.canselBubble = true;ie独有
    console.log('i')

事件捕获
结构上(非视觉上),嵌套关系的元素,会存在事件捕获的功能,即同一事件上,自父元素捕获向子元素(自顶向下)
ele.addEventLinstener(' ',' ',ture); ture代表开启事件捕获
onfocus,onblur,onchange,onsubmit,onreset,onselect等事件不冒泡
封装一个事件阻止冒泡兼容的函数

div.onclick = function(e){ 
    stopBubble(e);
    }

function stopBubble(event) {
            if (event.stopPropagation) {
                event.stopPropagation();
            } else {
                event.cancelBubble = true;
            }
        }

相关文章

  • DOM的事件模型和DOM事件流

    DOM的事件模型 DOM事件模型包括捕获和冒泡(ie用的是事件冒泡),捕获是从上往下到达目标元素,冒泡是从当前元素...

  • 前端面试题(3)——DOM事件类

    基本概念:DOM事件的级别 DOM事件模型:事件冒泡事件捕获 DOM事件流 描述DOM事件捕获的具体流程 Even...

  • 3-6 DOM事件

    问题 DOM 事件的级别 DOM 事件模型(就是捕获和冒泡儿) DOM 事件流 描述DOM事件捕获的具体流程 Ev...

  • Dom事件

    Dom事件的级别Dom事件模型(冒泡+捕获)Dom事件流 http://www.cnblogs.com/staro...

  • 事件流的3个阶段:捕获、冒泡、目标

    事件模型:IE事件模型和DOM标准事件模型区别:IE事件模型没有捕获阶段,只有冒泡。 事件流的三个阶段:先捕获阶段...

  • event相关

    1. DOM事件的级别 dom1标准在定义时,没有涉及dom事件相关 2. DOM事件模型 捕获和冒泡,捕获向下,...

  • JavaScript Events事件汇总

    事件参数、事件捕获冒泡 事件委托 事件默认行为 DOM 1 、DOM 2、DOM 3模型 实现遮罩功能(点击穿透、...

  • DOM事件处理模型—事件冒泡,捕获

    事件冒泡结构上(非视觉上),嵌套关系的元素,会存在事件冒泡的功能,即同一事件上,自子元素冒泡向父元素(自底向上)阻...

  • 前端面试准备--3.DOM事件

    DOM事件 1.基本概念:DOM事件的级别 2.DOM事件模型(冒泡捕获) 3.DOM事件流(页面中接受事件的顺序...

  • DOM事件的问题!

    1.事件冒泡 2.事件捕获 事件处理程序 1.HTML事件处理程序 2.DOM 0级事件处理程序 3.DOM 2级...

网友评论

      本文标题:DOM事件处理模型—事件冒泡,捕获

      本文链接:https://www.haomeiwen.com/subject/uwwszctx.html