<!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. 通过java反射实现简单的关于ＭongoDB的对象关系映射(ORM)．

    通过阅读MongoDB  3.2.1的官方文档中关于java 编程发现最新的文档并没有实现对对象到Document的映射,所以自己有了利用反射实现简单的关系映射． 1．定义抽象类:AbstractMo ...

  2. hdu 5272 Dylans loves numbers

    题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=5272 Dylans loves numbers Description Who is Dylans?Y ...

  3. core java 7 exception

    MODULE 7 Exceptions---------------------------- 程序正常执行过程中遇到的意外情况 引发异常的因素: 1)程序本身的内在因素 2)外部因素引发的,程序无须 ...

  4. mysql开启日志

    在 centos 5 下,  在 mysld 下面,添加一行 log=/var/log/mysql.log 然后执行如下命令 touch /var/log/mysql.logchmod 777 /va ...

  5. webservice soapclient报错Error fetching http headers

    设置: ini_set('default_socket_timeout', 600); // or whatever new value you want 参考:http://stackoverflo ...

  6. mac中添加环境变量

    sudo vi /etc/paths 来编辑 paths,将环境变量添加到 paths 中. vim 是一个编辑器,另外还有几个,如:Pico,Emacs.  

  7. DataTemplate 以及Template Selector 学习笔记

    1. 内容控件通过ContentTemplate,列表控件通过itemTemplate 来支持模板绑定.例子如下: 模板定义: xaml: <DataTemplate x:Key="R ...

  8. iOS 进阶 第十六天(0419)

    0419 任何view默认不支持多点触控,有一个属性设置Multiple Touch,设置为Yes即可支持多点触控 触摸移动一个view,让view也跟着动代码 关于触摸的一些解释: 注意:touch ...

  9. win8中如何禁用屏幕旋转的快捷键

    程序员通常会使用ctrl+alt+方向键 里编辑代码,特别对于使用eclipse的程序员,更是如此,但是win8却把这一快捷键给占用了,很不爽,如何办,很简单.直接上图: 2.但是发现禁用之后并没有解 ...

  10. 软件工程实践小队Scrum Meeting

    例会记录 时间:2013年10月20日星期日 Part 1 会议要点: 1. 小组讨论PM.Dev.Test的各自特点: 2. 小组讨论我们的项目网上教学问答系统的相关问题: 3.确定小组成员在第一轮 ...