js事件绑定/监听
2024-09-30 02:55:07
事件绑定/监听的方法
1.直接绑定
顾名思义,直接在DOM元素上绑定onclick、onmouseover、onmouseout、onmousedown、onmouseup、ondblclick、onkeydown、onkeypress、onkeyup等事件
var ul = document.getElementById('ul')
console.log(ul)
ul.onclick = function() {
console.log('click 事件绑定成功')
}
这种方法最简单,也是DOM level0最早支持的一种方法。但是这个方法存在一个很大的问题。那就是如果一个元素绑定事件时,有可能覆盖掉前面已经绑定好的事件!尤其是存在多个js文件时。为了解决这个问题,level2新增了事件监听
2.事件监听
事件监听实现的功能和直接绑定差不多,但是新增了一个特点。那就是无论监听次,都不会覆盖掉前面的监听事件。本质原因是监听事件每次都会生产一个全新的匿名函数,和前面的函数完全不同,自然不会覆盖。
var ul = document.getElementById('ul')
ul.addEventListener('click', function() {
console.log('事件绑定成功1')
})
ul.addEventListener('click', function() {
console.log('事件绑定成功2')
})
最新文章
- [收藏]IntelliJ Idea快捷键
- Javascript字节转换
- 重温Servlet学习笔记--response对象
- ILGenerator.Emit动态 MSIL编程(一)之基础
- codeIgniter怎么实现对input type=text对话框blur事件的监听以及传值?
- 帝国cms实现会员注册之后根据所在会员组转向的方法
- [ruby on rails] 跟我学之(10)数据输入验证
- WPF/Silverlight Template使用及总结(转)
- Magento模板Paypal付款不成功返回清空购物车产品【解决方案】
- linux文件解-压缩
- 异步方式向WPF ListBox控件中一条一条添加记录
- Python 装饰器装饰类中的方法
- Elasticsearch JAVA api搞定groupBy聚合
- 2016年第七届蓝桥杯javaB组 试题 答案 解析
- Android 模拟器启动不了-问题解决方案
- robot framework学习五——AutoltLibrary库
- C#窗体布局技巧
- Linux非常有用的命令
- linux上的语音识别程序
- Java并发知识(1)
热门文章
- LeetCode(73)Set Matrix Zeroes
- 更换SpringBoot中默认的web容器为jetty
- 【06】sass编译工具(弃)
- 儿子写日记 : "; 夜深了,妈妈在打麻将,爸爸在上网……";
- python015 Python3 函数
- Android ScaleDrawable
- POJ-Crazy tea party,很好的一道数学题~~~
- 洛谷—— P1785 漂亮的绝杀
- [Bzoj1030][JSOI2007]文本生成器(AC自动机)(dp)
- 学习swift从青铜到王者之Swift控制语句04