第一种

var test=document.getElementById('add');
add.onclick=function(){
alert('1');
}

直接在对象上注册事件

缺点:如果我想给add再加onchange 就会覆盖掉前面的onclick

优点:简单方便明了

第二种

var test=document.getElementById('add');
add.addEventListener('click',eve,false);
function eve(){
alert();
}

通过addEventListener来绑定事件

缺点:IE8搞出了attachEvent有时候要判断

优点:可以绑定多个事件还可以控制冒泡事件和捕捉事件

第三种

<span id="add" onclick='eve()'></span>
function eve(){
alert();
}

html绑定元素 同样是覆盖原则

JS 事件绑定的几种方式 小笔记的更多相关文章

  1. js事件绑定的几种方式与on()、bind()的区别

    版权声明:本文为博主原创文章,未经博主允许不得转载 一直不是很理解几种js事件绑定之间的区别与联系,今天百度了一下,在此做一总结: 1.如果只是简单的绑定一个事件,可以直接写在行内,点击执行一个函数, ...

  2. js事件绑定的几种方式

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

  3. JS事件绑定的三种方式比较

    js事件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...

  4. JS中事件绑定的三种方式

    以下是搜集的在JS中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="upl ...

  5. JavaScript 中事件绑定的三种方式

    以下是在 JS 中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="uplo ...

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

    (一)事件绑定的三种方式 (1)通过on的形式 <script type="text/javascript"> var div = document.getElemen ...

  7. js实现继承的5种方式 (笔记)

    js实现继承的5种方式 以下 均为 ES5 的写法: js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明确的继承机制,而是通过模仿实现的,根据js语言的本身的特性,js实现继承 ...

  8. Javascript事件绑定的几种方式

    Javascript的事件绑定主要有四种方法(一下在IE中运行正常,但不保证其他浏览器): [注:onXXX为某一事件,fun为某一function,domId为某一DOM对象id,event类型见后 ...

  9. jQuery中的事件绑定的几种方式

    jQuery目前有on(),bind(),delegate(),live()四种绑定方式,但是随着版本的不断更新,有的方式也相应的被淘汰掉 [band()方式绑定] 3.0版本之前的绑定方式比较常用的 ...

随机推荐

  1. iOS10隐私设置及相应问题

    iOS10新添加了10个隐私设置: NSBluetoothPeripheralUsageDescription="App需要您的同意,才能访问蓝牙"; NSCalendarsUsa ...

  2. Android 菜单(OptionMenu)大全 建立你自己的菜单

    转自:http://www.cnblogs.com/salam/archive/2011/04/04/2005329.html 菜单是用户界面中最常见的元素之一,使用非常频繁,在Android中,菜单 ...

  3. hdu 5501 The Highest Mark(贪心+01背包)

    题意:类似cf的赛制,每道题目有A,B,C三个值,A表示初始分数,B表示每分钟题的分数会减少B,C表示做这道题需要C分钟,数据保证分数不会变为负数.现在给出比赛时长,问安排做题的顺序,求最大得分. 思 ...

  4. sso单点登录解决方案收集

    本文来自:http://blog.csdn.net/huwei2003/article/details/6038017 我的想法是使用集中验证方式,多个站点集中Passport验证. 主站:Passp ...

  5. web api 文档声明

    namespaceHelloWebAPI.Controllers{     usingHelloWebAPI.Models;     usingSystem;     usingSystem.Coll ...

  6. PipedInputStream/PipedOutputStream原理

    PipedInputStream类与PipedOutputStream类用于在应用程序中创建管道通信.一个PipedInputStream实例对象必须和一个PipedOutputStream实例对象进 ...

  7. RSA不对称加密,公钥加密私钥解密,私钥加密公钥解密

    RSA算法是第一个能同时用于加密和数字签名的算法,也易于理解和操作. RSA是被研究得最广泛的公钥算法,从提出到现在已近二十年,经历了各种攻击的考验,逐渐为人们接受,普遍认为是目前最优秀的公钥方案之一 ...

  8. 使用Open Live Writer 的代码高亮插件体验

    由于windows live writer 2012 已经停止服务,转而推出开源项目Open Live Writer .虽然Open Live Writer 也没怎么更新,官网更是一个插件都没有放出来 ...

  9. BZOJ 4011: [HNOI2015]落忆枫音( dp )

    DAG上有个环, 先按DAG计数(所有节点入度的乘积), 然后再减去按拓扑序dp求出的不合法方案数(形成环的方案数). ---------------------------------------- ...

  10. Inno setup卸载前退出进程、删除文件夹

    [Code]function InitializeUninstall(): Boolean; var MainRun: HWND; var MVRun:HWND; begin// FindWindow ...