<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

</head>

<body>

    <div>

        <span></span>

        <ul>

            <li>nextSibling</li>

            <li>nextSibling</li>

            <li>nextSibling</li>

            <li>nextSibling</li>

            <li>nextSibling</li>

        </ul>

    </div>

    <script type="text/javascript">

        window.onload = function () {

        };

        function next(ele) {

            if (typeof ele.nextElementSibling == 'object') {

                return ele.nextElementSibling;

            }

            var n = ele.nextSibling;

            while (n) {

                if (n.nodeType == 1) {

                    return n;

                }

                n = n.nextSibling;

            }

            return n;

        }

        function fn(e) {

            e = e || window.event;

            if (e.stopPropagation) {

                e.stopPropagation();

            } else {

                e.cancelBubble = true;

            }

            if (e.stopPropagation()) {

                e.stopPropagation();//标准浏览器阻止默认方式

            } else {

                e.returnValue = false;//IE的组织默认行为

            }

        }

        function fn2() {

            alert(this.nodeName);

        }

        var ele = document.getElementsByTagName('li');

        for (var i = 0; i < ele.length; i++) {

            ele.item(i).addEventListener('click', fn2, false);

        }

        document.body.addEventListener("click", fn2, false);

        document.body.addEventListener('click', fn, true);

        document.addEventListener('click', fn, true);

        //内到外 冒泡 IE支持

        //外到内 捕获 IE不支持

    </script>

</body>

</html>

　　

Javascript 事件冒泡的更多相关文章

  1. 解析Javascript事件冒泡机制

    本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/ ...

  2. 转：JavaScript事件冒泡简介及应用

    (本文转载自别处) JavaScript事件冒泡简介及应用   一.什么是事件冒泡 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理 ...

  3. JavaScript事件冒泡和事件委托

    JavaScript事件冒泡和事件委托 付建宇 - 2 条评论 接触JavaScript不久,学的东西也不是特别多.小雨就是习惯把平时学到的东西拿出来分享.一方面加强自己的印象,一方面可以让自己的经验 ...

  4. JavaScript事件——冒泡、捕获

    本节要点:1.干预系统的事件处理机制 (一)DOM事件流 (二)停止事件冒泡 (三)阻止事件的默认行为 1.干预系统的事件处理机制 (一)DOM事件流 DOM模型是一个树形结构,在DOM模型中,HTM ...

  5. Javascript事件冒泡机制

    1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然后做出相应的动作. 浏览器的事件表示的是某些事情发生的信号.事件的阐述不是本文的重点,尚未了解的朋友,可以访问W3scho ...

  6. JavaScript事件冒泡简介及应用

    一.什么是事件冒泡 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事 件处理程序或者事件返回true,那么这个 ...

  7. javascript事件冒泡

    1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然后做出相应的动作. 浏览器的事件表示的是某些事情发生的信号.事件的阐述不是本文的重点,尚未了解的朋友,可以访问W3scho ...

  8. 解析Javascript事件冒泡机制(转) 本文转自：http://blog.csdn.net/luanlouis/article/details/23927347

    本文转自:http://blog.csdn.net/luanlouis/article/details/23927347 1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然 ...

  9. JavaScript事件冒泡机制和阻止事件冒泡及默认事件

    一.阻止事件冒泡: 1.html中加return false 2.js中加return false 3.IE下:window.event.cancelBubble = true:  FF下:event ...

  10. 解析Javascript事件冒泡机制(转)

    本文转自:http://blog.csdn.net/luanlouis/article/details/23927347 1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然 ...

随机推荐

  1. ref和out的区别

    ref类型参数是按地址传递,能改变原来的数值.使用ref传参前,变量必须赋值. 带有ref类型参数的函数,不会清空变量,所以离开该函数的时候,所有ref引用的变量可以赋值也可以不赋值. out类型参数 ...

  2. AppCan移动平台开发常见问题解答

    在使用AppCan移动平台开发跨平台APP时,有开发者会遇到一些问题, 不急,跟笔者一起来聊一聊使用AppCan平台开发中常见问题的解答方法. 问1.正常是按照官网提供的4个iphone启动图尺寸来做 ...

  3. hdu 1874 畅通工程续

    题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=1874 畅通工程续 Description 某省自从实行了很多年的畅通工程计划后,终于修建了很多路.不过 ...

  4. Android操作系统11种传感器介绍

    我们依次看看这十一种传感器 1 加速度传感器 加速度传感器又叫G-sensor,返回x.y.z三轴的加速度数值. 该数值包含地心引力的影响,单位是m/s^2. 将手机平放在桌面上,x轴默认为0,y轴默 ...

  5. java intellij 写控制台程序 窗口程序

    建一个空项目,建一个main函数  用application,就可以运行了 /**  * Created by robin on 15/10/11. */public class hello { pu ...

  6. iOS学习之C语言分支结构

    一.BOOL类型 返回值:真:YES   假:NO 定义一个布尔类型的变量 YES == 1, NO == 0 计算机在识别时,YES就替换成1,NO就替换成0 BOOL isGirl = YES; ...

  7. EF之高级查询

    首先我们来看看一个页面 这里面有多选的条件,大于,小于等等,包括每个字段都有 如此多的查询条件,我们的后台该如何实现呢? 难道我们还得每个参数都去判断吗? 那得传多少参数进来才能实现这个页面的功能啊! ...

  8. MVC3+中 ViewBag、ViewData和TempData的使用和区别

    在MVC3开始,视图数据可以通过ViewBag属性访问,在MVC2中则是使用ViewData.MVC3中保留了ViewData的使用.ViewBag 是动态类型(dynamic),ViewData 是 ...

  9. 安装MSITVPN连接的时候弹出：需要(未知)上的文件'MSITVPN.bmp。

    使用 msitvpn 连接microsoft 公司内网,在安装msitvpn的时候突然弹出一个对话框提示需要msitvpn.bmp 文件,找了很久都没找到解决问题方案. 最后只能猜测是不是和用户的权限 ...

  10. 004--VS C++ 绘制封闭图形

    //全局变量HPEN hPen;HBRUSH hBru[4];int sBru[4] = { HS_VERTICAL, HS_HORIZONTAL, HS_CROSS, HS_DIAGCROSS }; ...