zoukankan      html  css  js  c++  java
  • JavaScript事件流--事件冒泡、目标与事件捕获

    1.事件冒泡

    微软提出了名为事件冒泡的事件流。事件冒泡可以形象地比喻为把一颗石头投入水中,泡泡会一直从水底冒出水面。也就是说,事件会从最内层的元素开始发生,一直向上传播,直到document对象。

    因此上面的例子在事件冒泡的概念下发生click事件的顺序应该是p -> div -> body -> html -> document

    2.事件捕获

    网景提出另一种事件流名为事件捕获与事件冒泡相反,事件会从最外层开始发生,直到最具体的元素。

    上面的例子在事件捕获的概念下发生click事件的顺序应该是document -> html -> body -> div -> p

    关于冒泡的实例:

    HTML:

    <div class="abc" id="box">点击:演示冒泡</div>

    JavaScript:

    window.addEventListener('load', function () {
    var box = document.getElementById('box');
    box.addEventListener('click', function () { alert('Lee');}, false);//把false改为true,演示捕获
    document.addEventListener('click', function () {alert('document');}, false);//把false改为true,演示捕获
    }, false);
  • 相关阅读:
    大臣的旅费 Apare_xzc 求树的直径 蓝桥杯
    连号区间数 Apare_xzc
    js盒模型
    js仿真进度条
    JS卷动事件
    json对象读取
    button属性及兼容性处理
    js图片跟随效果
    商城倒计时JS怎么做
    计算某天距离现在日期的差值
  • 原文地址:https://www.cnblogs.com/sdgf/p/4837446.html
Copyright © 2011-2022 走看看