<!DOCTYPE html>

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

<head>

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

    <title></title>

    <script type="text/javascript">

        window.onload = function () {

            var list = document.getElementById("myLinks");

            list.onclick = function (event) {

                var target = event.target;

                switch (target.id) {

                    case "doSomething":

                        document.title = "I change the document's title";

                        break;

                    case "goSomewhere":

                        location.href = "http://baidu.com";

                        break;

                    case "sayHi":

                        alert("hi");

                        break;

                }

            }

        }

    </script>

</head>

<body>

    <ul id="myLinks">

        <li id="goSomewhere">Go somewhere</li>

        <li id="doSomething">Do something</li>

        <li id="sayHi">Say hi</li>

    </ul>

</body>

</html>

这样的好处是，不需要为3个li 增加Onclick事件，从而节约内存

　　

利用事件的冒泡特性，为子标签添加Onclick事件的更多相关文章

  1. a 标签添加 onclick 事件

    a 标签添加 onclick 事件 <a href="javascript:void(0);" οnclick="js_method()">点击&l ...

  2. js实现冒泡事件，点击ul给子标签添加相同事件和阻止冒泡事件

    $('#LocalLife_PopUp_layer').find('.SelectCity_Cont ul').click(function(e){            var e=e||windo ...

  3. 【Javascript】IE8兼容 背景图片与a标签的onclick事件

    先说几句牢骚话. 虽然IE8比之IE6.7有很大的进步,但是在执行效率.兼容性上仍然有很多问题.被广大开发者喜爱的平台才是好平台. 可惜多亏当年盗版XP打开中国的计算机市场,IE作为一款捆绑软件仍然在 ...

  4. jq动态添加onclick事件在谷歌中不起作用

    $("#oa-bed-rooType").append($('<option/>').val(0).text('请选择房间类型')); $('#oa-bed-roomT ...

  5. 解决IE6下a标签的onclick事件里的超链接不跳转问题

    今天遇到个很诡异的问题,就是<a href="javascript:void(0);" onclick="window.location=url"> ...

  6. 原生js怎么为动态生成的标签添加各种事件

    这几天用zepto.js写了不少事件,突然想到一个问题,那就是原生的js如何给动态生成的标签添加事件?因为这些标签都是后来通过ajax或者运行其他点击事件生成的,那么如果之前给他们写事件他们这个dom ...

  7. 关于Asp.net事件，如何在触发子控件的事件时，同步触发父页面的事件

    对页面引用自定义控件后,通过绑定自定义事件,页面绑定子控件的事件,在子控件做了某些修改动作后,如何同步操作父页面的方法:下面我煮了个栗子,同学们可以来尝一尝试一试 a.aspx 引用 UserCont ...

  8. WEB前端问题——img标签的onclick事件无法响应问题【转载】

    一个纠结了一下午的问题,img标签里面的onclick事件无法响应.最终找到了错误原因,是因为img标签的id与onclick事件的方法名相同. 于是接着又测试了一下,发现name名和方法名相同也会导 ...

  9. 使用JavaScript动态的绑定、解绑 a 标签的onclick事件，防止重复点击

    页面上的 a 标签如下: <a class="more" style="cursor: pointer;" id="commentMore&qu ...

随机推荐

  1. 【C# 线程】C++与C#数据类型对照表

    详细:http://lzltool.com/doc/csharptocaddadd

  2. 【C# 基础概念】表达式(expression)、语句(statement)、块(block)，指令（using）

    官方链接:https://docs.microsoft.com/zh-cn/dotnet/csharp/programming-guide/statements-expressions-operato ...

  3. 用python构建一个多维维数组

    用python构建一个二维数组 解法? 方法1: num_list=[0]*x//表示位创建一个一维数组为num_lis[x],且数组中的每一项都为0 num_list=[[0]*x for i in ...

  4. pandas补充(其二)与matplotlib补充

    今日内容概要 pandas补充知识(2) matplotlib补充知识 今日内容详细 pandas补充 数据汇总 # 数据透视表 pd.pivot_table(data,values-None,ind ...

  5. 【python画圆】pip安装库时出现Read timed out.解决办法

    昨天第一次用python画圆,当时并没有安装numpy库(导入数据包)和matplotlib库(导入图形包),于是尝试用pip安装库 首先,我先更新了pip,如下图: 顺便附上成功截图: 然后安装nu ...

  6. 02 基础 卸载JDK 安装JDK Java程序运行机制

    基础 JDK:Java Development Kit(Java开发者工具 包含JRE和JVM) JRE:Java Runtime Environment(java运行时环境,包含JVM) JVM:J ...

  7. 手写 Vue2 系列 之 初始渲染

    前言 上一篇文章 手写 Vue2 系列 之 编译器 中完成了从模版字符串到 render 函数的工作.当我们得到 render 函数之后,接下来就该进入到真正的挂载阶段了: 挂载 -> 实例化渲 ...

  8. WPF之VisualTreeHelper

     /// <summary>        /// </summary>        /// <typeparam name="T">< ...

  9. 阿里一面，说说你对Mysql死锁的理解

    又到了金三银四的时候,大家都按耐不住内心的躁动,我在这里给大家分享下之前面试中遇到的一个知识点(死锁问题),如有不足,欢迎大佬们指点指点. 1.什么是死锁? 死锁指的是在两个或两个以上不同的进程或线程 ...

  10. [SPDK/NVMe存储技术分析]006 - 内存屏障(MB)

    在多核(SMP)多线程的情况下,如果不知道CPU乱序执行的话,将会是一场噩梦,因为无论怎么进行代码Review也不可能发现跟内存屏障(MB)相关的Bug.内存屏障分为两类: 跟编译有关的内存屏障: 告 ...