<!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. 还在争论WPS、Office哪个更好用？这款云办公工具才是真的香！

    最近,金山WPS更新狠狠的刷了一波存在感.尤其是xlookup函数,着实是有被惊艳到,也让大家看到了国产办公软件的进步.甚至有人认为WPS已经超越了传统的办公软件--微软office.WPS的优点固然 ...

  2. Keepalived非抢占模式配置

    一.前言 HA的实际运行过程中,当主机发生异常,且后期恢复正常后,存在抢占或非抢占两种情况. 结合实际需求,可能有很多用户需要非抢占的HA工作模式.keepalived能够很好的支持这一需求. 二.k ...

  3. 案例二：shell脚本获取当前日期和时间及磁盘使情况

    习题分析 本题有两个核心知识点: 1. 如何自动表示当天的日期 2. 磁盘使用情况 打印日期的命令为 date,示例命令如下: # date 2017 年 12 月 20 日 星期三 16:26:55 ...

  4. Scala学习笔记（详细）

    第2章 变量 val,var,声明变量必须初始化:变量类型确定后不可更改 数据类型:与java有相同的数据类型,在scala中数据类型都是对象 特殊类型:Unit:表示无值,只有一个实例值写出(),相 ...

  5. csv 转换为DBF文件的方法

    转至:https://www.cnblogs.com/hssbsw/archive/2012/12/01/2797140.html csv 转换为DBF文件的方法 最近从SQL导出了许多CSV文件发到 ...

  6. 《Symfony 5全面开发》教程04、Symfony处理http请求的流程

    当我们访问项目的/test路径时,浏览器会向我们的服务器端发送一个请求.我们打开浏览器的开发者工具,打开network选项卡. 在地址栏中敲击回车,浏览器向我们的服务器端发送了一个请求.请求的地址是1 ...

  7. AcWing 289. 环路运输

    传送门 思路: 一个环路上的问题,考虑拆环为链然后复制一倍接在后面.那么对于Ai与Aj,不妨设j<i,如果i-j>N/2则两者距离在新的链上就是i-j,而如果i-j<=N/2那么两者 ...

  8. MySQL — DCL语言

    全称 Data Control Language.数据控制语言,用来创建数据库用户.控制数据库的访问权限. 1.用户管理 1.1.查询用户 select * from user; 1.2.创建用户 - ...

  9. 『现学现忘』Docker基础 — 12、通过RPM软件包方式安装Docker

    CentOS环境下的Docker官方推荐的三种安装方式 yum安装方式 本地RPM安装方式 脚本安装方式 目录 1.下载Docker的RPM安装包 2.安装Docker 3.通过RPM安装包安装Doc ...

  10. MySQL优化之索引解析

    索引的本质 MySQL索引或者说其他关系型数据库的索引的本质就只有一句话,以空间换时间. 索引的作用 索引关系型数据库为了加速对表中行数据检索的(磁盘存储的)数据结构 索引的分类 数据结构上面的分类 ...