JavaScript 点击事件的三种写法
2024-10-20 04:12:42
嵌入式
<button οnclick='alert("hello")'>点击按钮</button>
脚本模型
btn.onclick=function(){}
下面两种方法效果是一样的
document.getElementById("target").onclick();
document.getElementById("target").click();
备注:
btnObj.click()是真正地用程序去点击按钮,触发了按钮的 onclick()事件
btnObj.onclick()只是简单地调用了btnObj的onclick所指向的方法,只是调用方法而已,并未直接触发事件
W3C事件写法
添加事件:appEventListener(事件名,事件函数,false )
btn.addEventListener('click',function(){},false);
btn.addEventListener('click',function(){},false);
移除事件:removeEventListener(事件名,事件函数名,false)
btn.removeEventListener('click',show,false )
第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。
事件冒泡或事件捕获
事件传递有两种方式:冒泡与捕获。
事件传递定义了元素事件触发的顺序。 如果你将
元素插入到
元素中,用户点击
元素, 哪个元素的 "click" 事件先被触发呢?
在 冒泡 中,内部元素的事件会先被触发,然后再触发外部元素,即:
元素的点击事件先触发,然后会触发
元素的点击事件。在 捕获 中,外部元素的事件会先被触发,然后才会触发内部元素的事件,即:
元素的点击事件先触发 ,然后再触发元素的点击事件。
addEventListener(event, function, useCapture);
默认值为 false, 即冒泡传递,当值为 true 时, 事件使用捕获传递。
最新文章
- hdu1282回文数猜想
- 360路由器c301最新固件支持万能中继
- Android 全屏显示的方法(不包含状态栏)
- [Leetcode][JAVA] Valid Palindrome
- 自制 JS.format带分页索引
- 软件测试 -- 和用户共同测试(UAT测试)的注意点有哪些
- win7桌面图标小盾牌怎么去掉(2种方法)
- tomcat部署web项目的三种方式
- hdu1025
- innobackup全备与恢复
- Scrapy爬虫实例教程(二)---数据存入MySQL
- 转 Eclipse快捷键调试大全
- ibatis.net之我的调整:Update语句的动态set字段
- 解决linux下source /etc/profile关闭终端失效问题
- 20155323刘威良《网络对抗》Exp5 MSF基础应用
- RK3288 GT触摸屏移植调试
- Linux学习—导航文件系统
- 如何看MFC程序
- 【bzoj4888】: [Tjoi2017]异或和 BIT-乱搞
- HDU 6070 Dirt Ratio(线段树)