<ul id="box">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>

普通情况下:通过循环绑定所有

    var li=document.getElementsByTagName("li");
for(var i=0;i<li.length;i++){
li[i].addEventListener("click",function(e){
console.log(e.target.innerHTML);
})
}

使用代理:通过父层绑定,那就不用给每个子元素绑定了

var box=document.getElementById("box");
box.addEventListener("click",function(e){
console.log(e.target.innerHTML);
});

注意:addEventListener 在IE不支持,需要使用attachEvent,事件名称,含“on”

var box=document.getElementById("box");
box.attachEvent("onclick",function(e){
alert(e.srcElement.innerHTML);
});

javascript:使用代理绑定事件的更多相关文章

  1. JavaScript三种绑定事件的方式

    JavaScript三种绑定事件的方式: 1. <div id="btn" onclick="clickone()"></div> // ...

  2. JavaScript跨浏览器绑定事件函数的优化

    JavaScript作为一门基于事件驱动的语言(特别是用在DOM操作的时候),我们常常需要为DOM绑定各种各样的事件.然而,由于低版本的IE的不给力,在绑定事件和移除事件监听上都与众不同,我们常常需要 ...

  3. 【JavaScript】jQuery绑定事件

    jquery中直接绑定事件:只能用在程序中一开始就存在的html代码 目标元素.click(function(){ }) jquery中间接绑定事件: 如果目标元素是js生成的,则需要间接绑定事件,用 ...

  4. javascript为元素绑定事件响应函数

    javascript中为元素设置响应时间有两种方法. (1):object.onclick=functionName; 这种方法不可以传递参数. (2):object.onclick=function ...

  5. JavaScript绑定事件的方法[3种]

    在JavaScript中,有三种常用的绑定事件的方法: 在DOM元素中直接绑定: 在JavaScript代码中绑定: 绑定事件监听函数. 一. 在DOM元素中直接绑定 这里的DOM元素,可以理解为HT ...

  6. JavaScript中,有三种常用的绑定事件的方法

    要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有三种常用的 ...

  7. javascript事件有哪些?javascript的监听事件

    事件类型: 1.界面事件 onload:描述文档,图片,css已经frame,object加载完毕时触发,window.onload window.onload = function(){ //代表图 ...

  8. JavaScript 三种绑定事件方式之间的区别

    JavaScript三种绑定事件的方式: 1. <div id="btn" onclick="clickone()"></div> // ...

  9. JavaScript中绑定事件监听函数的通用方法addEvent() 和 事件绑定之bindEvent()与 unBindEvent()函数

    下面绑定事件的代码,进行了兼容性处理,能够被所有浏览器支持: function addEvent(obj,type,handle){ try{ // Chrome.FireFox.Opera.Safa ...

随机推荐

  1. bzoj3918 [Baltic2014]Postman

    传送门:http://www.lydsy.com/JudgeOnline/problem.php?id=3918 [题解] 每日至少更一题啊qwq凑任务(迷 明显猜个结论:随便搜环就行了 然后搜环姿势 ...

  2. 好几次的CSS存档

    第一次: #site_nav_under { display: none; } .c_ad_block, .ad_text_commentbox { display: none; margin:; p ...

  3. es查询与聚合

    """ 官方文档:https://www.elastic.co/guide/cn/elasticsearch/guide/current/aggregations.htm ...

  4. mysql五:数据操作

    一 介绍 MySQL数据操作: DML ======================================================== 在MySQL管理软件中,可以通过SQL语句中的 ...

  5. HDU3910(数学期望题,题目难懂)

    Liang Guo Sha Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Tot ...

  6. kuangbin带你飞 最短路 题解

    求一个图最短路边的办法.好像下面的那个有问题.单向边和双向边一定是有区别的.这个比较容易.参照该文的最短路网络流题目和连通图题目一题求最短路关节边 另外上述2个题目的代码好像有问题. 在UVALIVE ...

  7. 面试===Linux试题及答案

    一. 单选题: 1.添加一条静态路由,使到网络196.199.3通过eth2接口出去,用: A. route add -net 196.199.3.0 B. route add -net 196.19 ...

  8. Xcode升级到7之后 发现速度超级慢

    Xcode升级到7之后 发现速度超级慢 转自:http://www.jianshu.com/p/608803eb1e12 解决方法,慢google了一下是由于插件造成饿,于是乎将Alcatraz安装的 ...

  9. 【 Linux 】三大主流软件负载均衡器对比(LVS、Nginx、HAproxy)

    三大主流软件负载均衡器对比(LVS.Nginx.HAproxy) (资料来自网络,做了部分的补充说明) LVS:    1. 抗负载能力强,性能高,能达到F5的60%,对内存和CPU资源消耗比较低   ...

  10. Tornado 模块概述

    Tornado模块分类 1. Core web framework tornado.web — 包含web框架的大部分主要功能,包含RequestHandler和Application两个重要的类 t ...