第三天:DOM EventListener 句柄的添加和移除
1.事件句柄的包含如下两个方法:

ps:使用句柄的好处是,修改方法的名称时,不需要改变多处

1.添加一个句柄,

2.添加多个句柄不会覆盖,运行结果:点击“按钮”,弹出框hello,确定后,自动弹出框world

3.句柄的移除:运行结果:点击按钮,只会弹出world对话框

代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<button id="btn">按钮</button>
<script>
var x=document.getElementById("btn");
x.addEventListener("click",demo1); //添加句柄
x.addEventListener("click",demo2); //添加句柄
x.removeEventListener("click",demo1); //移除句柄
function demo1(){
alert("hello");
}
function demo2(){
alert("world");
}
</script>
</body>
</html>
问题:添加句柄函数括号内究竟该怎么写呢,看帮助看不出来
方式1:
x.addEventListener("click",demo2) 方式1demo2为方法名
方式2:

第三天:DOM EventListener 句柄的添加和移除的更多相关文章
- DOM操作——JavaScript怎样添加、移除、移动、复制、创建和查找节点
(1). 创建新节点 createDocumentFragment() // 创建一个DOM片段 createElement() // 创建一个具体的元素 createTextNode() // 创建 ...
- DOM - EventListener 句柄操作
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" c ...
- JavaScript HTML DOM EventListener
JavaScript HTML DOM EventListener addEventListener() 方法 实例 点用户点击按钮时触发监听事件: document.getElementById(& ...
- 给DOM生成的元素添加事件
问题:通过js给页面添加新元素,并给该元素添加绑定事件,但新添加的元素上却没有绑定任何事件. 常见例子:在处理表格的时候,每行行末有个删除按钮,如下图.点击删除按钮的时候删除这一行. //html部分 ...
- DOM操作 ——如何添加、移除、移动、复制、创建和查找节点等。
DOM操作 --如何添加.移除.移动.复制.创建和查找节点等. (1)创建新节点 createDocumentFragment() //创建一个DOM片段 createElement() //创建一个 ...
- JS基础速成(三)- DOM(文件对象模型)
.t1 { background-color: #ff8080; width: 1100px; height: 40px } 一.DOM树的基本结构 DOM节点分为三大类:元素节点(标签节点),属性节 ...
- JavaScript(三、DOM文档对象模型)
一.什么是DOM DOM 是 Document Object Model(文档对象模型)的缩写. DOM 是 W3C(万维网联盟)的标准. DOM 定义了访问 HTML 和 XML 文档的标准: &q ...
- 将HTML字符转换为DOM节点并动态添加到文档中
将HTML字符转换为DOM节点并动态添加到文档中 将字符串动态转换为DOM节点,在开发中经常遇到,尤其在模板引擎中更是不可或缺的技术. 字符串转换为DOM节点本身并不难,本篇文章主要涉及两个主题: 1 ...
- 手写面试编程题- 数组去重 深拷贝 获取文本节点 设置奇数偶数背景色 JS中检测变量为string类型的方法 第6题闭包 将两个数组合并为一个数组 怎样添加、移除、移动、复制、创建和查找节点? 继承 对一个数组实现随机排序 让元素水平 垂直居中的三种方式 通过jQuery的extend方法实现深拷贝
第1题==>实现数组去重 通过 new Set(数组名) // var arr = [12, 12, 3, 4, 5, 4, 5, 6, 6]; // var newarr1 = new Set ...
随机推荐
- nodejs生成UID(唯一标识符)——node-uuid模块
unique identifier 惟一标识符 -->> uid 在项目开发中我们常需要给某些数据定义一个唯一标识符,便于寻找,关联. node-uuid模块很好的提供了这个 ...
- dedecms代码研究五
上一次留几个疑问: 1)DedeTagParse类LoadTemplet方法. 2)MakeOneTag到底在搞什么. 从DedeTagParse开始前面,我们一直在dedecms的外围,被各种全局变 ...
- Redis的Python客户端redis-py的初步使用
1. Redis的安装 sudo pip install redis sudo pip install hiredis Parser可以控制如何解析redis响应的内容.redis-py包含两个Par ...
- 1.openssl genrsa
genrsa用于生成RSA私钥.不会生成公钥,因为公钥提取自私钥,如果需要查看公钥或生成公钥,可以使用openssl rsa命令,后文介绍. man genrsa查询其用法. [root@xuexi ...
- TortoiseSVN-1.8.11 安装时弹出2503错误导致安装失败解决办法
这个问题主要是由于msi格式文件在win8中默认不是以管理员身份运行造成,可通过命令行解决: 右键单击win8左下角启动图标,选择命令提示符(管理员): 输入:msiexec /package 要安装 ...
- [笔记]Modelsim系列01:编译Altera库的方法
意义:一劳永逸,不用每次对那些包含Quartus II生成文件的工程进行功能仿真时,都需要重新编译一堆东西.节约时间成本. 版本:ModelSim SE 6.5d 打开Modelsim软件,默认会打开 ...
- Karma +Jasmine+ require JS进行单元测试并生成测试报告、代码覆盖率报告
1. 关于Karma Karma是一个基于Node.js的JavaScript测试执行过程管理工具(Test Runner). 该工具可用于测试所有主流Web浏览器,也可集成到CI(Continuou ...
- XGBoost参数调优完全指南(附Python代码)
XGBoost参数调优完全指南(附Python代码):http://www.2cto.com/kf/201607/528771.html https://www.zhihu.com/question/ ...
- C#模拟浏览器发get,post请求
调用: JArray ja = (JArray)JsonConvert.DeserializeObject("["+GetDataPost()+"]"); Re ...
- Python全栈之路6--正则表达式
正则本身就是一门语言: 正则表达式使用单个字符串来描述.匹配一系列符合某个句法规则的字符串,在文本处理方面功能非常强大,也经常用作爬虫,来爬取特定内容,Python本身不支持正则,但是通过导入re模块 ...