1.语法:document.getElementById('btn').addEventListener

2.可以添加多个EventListener,且不会覆盖

3、移除EventListener, document.getElementById('btd').removeEventListener("click",functionName);

事件处理:

1、级处理html直接添加 Onclick事件

2、dom0级处理,通过getElementbyId('id').onclick = function() ;清空事件可以 getElementbyId('id').onclick = null;

3、dom1级处理,添加Eventlistenner处理。

事件阻止传递:

event.stopPropagation();

function showType(event){

event.stopPropagation();

}

阻止默认事件

event.preventDefault();

判断事件能否处理:

if(btn1.addEventListener){

btn1.addEventListener("click",function(){})

}else{

btn1.onclick=function{}

}

dom添加事件的更多相关文章

  1. zepto | 用事件委托去解决无法给新增添的DOM添加事件的问题

    前段时间在做一个任务的时候,碰见了一个问题:zepto无法用on事件去监听新增加的dom事件.这个问题用live可解决, 但是live在ios下失效,为了解决这个问题,我采用了暴力的方法去解决,每次添 ...

  2. 如何给js动态创建的dom添加事件

    delegate() 方法 实例 当点击鼠标时,隐藏或显示 p 元素: $("div").delegate("button","click" ...

  3. Vue(基础五)_vue中用ref和给dom添加事件的特殊情况

    一.前言 这篇文章涉及的主要内容有: 1.ref绑定在标签上是获取DOM对象 2.ref绑定在子组件上获取的是子组件对象 3.案列:自动获取input焦点 二.主要内容 1.基础内容: ref 被用来 ...

  4. 给DOM生成的元素添加事件

    问题:通过js给页面添加新元素,并给该元素添加绑定事件,但新添加的元素上却没有绑定任何事件. 常见例子:在处理表格的时候,每行行末有个删除按钮,如下图.点击删除按钮的时候删除这一行. //html部分 ...

  5. 如何在通过knockout数据绑定的DOM元素上添加事件

    通过knockout数据绑定的DOM元素,通过chrome控制台打断点知道,DOM元素会被暂时隐藏,使用document.querySelector()是获取不到的,会显示null,直到数据绑定完成才 ...

  6. 在js文件中通过jquery定位到某个dom时候设置事件时候 相当于直接在dom里面添加事件

    在js文件中通过jquery定位到某个dom时候设置事件时候 相当于直接在dom里面添加事件  当触发事件时候 会把当前的dom传给该方法

  7. 给DOM操作生成的元素添加事件

    问题:通过js给页面添加新元素,并给该元素添加绑定事件,但新添加的元素上却没有绑定任何事件. 常见例子:在处理表格的时候,每行行末有个删除按钮,如下图.点击删除按钮的时候删除这一行. //html部分 ...

  8. jquery技巧之让任何组件都支持类似DOM的事件管理

    本文介绍一个jquery的小技巧,能让任意组件对象都能支持类似DOM的事件管理,也就是说除了派发事件,添加或删除事件监听器,还能支持事件冒泡,阻止事件默认行为等等.在jquery的帮助下,使用这个方法 ...

  9. 给Jquery动态添加的元素添加事件

    给Jquery动态添加的元素添加事件 来源:[http://wangqixia.diandian.com/post/2011-05-10/6597866] 我想很多人都会向我一样曾经 被新元素的事件绑 ...

随机推荐

  1. Python类属性详解

    在python开发中,我们常常用到python的类,今天就通过实例和大家扒一扒类的属性,一起来看看吧. 类属性 1.类定义后就存在,而且不需要实例化 2.类属性使得相同类的不同实例共同持有相同变量 类 ...

  2. 多语言的sitemap xml

    请注意一下 sitemap xml 也有多语言的

  3. selenium+python笔记10

    #!/usr/bin/env python # -*- coding: utf-8 -*- """ 我们多添加一些测试场景,比如:删除邮件,查找邮件,发送邮件等等 &qu ...

  4. 网络编程之socket(转)

    “一切皆Socket!” 话虽些许夸张,但是事实也是,现在的网络编程几乎都是用的socket. ——有感于实际编程和开源项目研究. 我们深谙信息交流的价 值,那网络中进程之间如何通信,如我们每天打开浏 ...

  5. IO流--字符流

    import java.io.BufferedReader; import java.io.BufferedWriter; import java.io.FileReader; import java ...

  6. Python eclipse开发环境搭建

    http://jingyan.baidu.com/article/cd4c2979101f02756f6e6064.html http://jingyan.baidu.com/article/1876 ...

  7. 委托传参,lambda

    今天一朋友问到一问题,怎么在timer的委托里面传参数,我初一想Invoke 可以传参数吧,我就说了. 后来他说这个委托是微软定义,不能变参数,于是我就自己写了一段代码试 试. 我最初写的代码如下 p ...

  8. Javascript 严格模式详解(转)

    一.概述 除了正常运行模式,ECMAscript 5添加了第二种运行模式:"严格模式"(strict mode).顾名思义,这种模式使得Javascript在更严格的条件下运行. ...

  9. Metro UI(Win 8风格)页面设计小记

    一.Metro风格菜单——简单 HTML <div class="pagina "> <div class="linha"> <d ...

  10. 【北京站】详解Visual Studio 2013:开发iOS及android应用!现场图集

    现场图集: 活动介绍地址:http://huiyi.csdn.net/module/meeting/meeting/info/660/biz