码迷,mamicode.com
首页 > 其他好文 > 详细

DOM EventListener

时间:2019-01-15 00:39:20      阅读:183      评论:0      收藏:0      [点我收藏+]

标签:等价   lse   cap   get   func   函数   类型   事件   语法   

向元素添加事件句柄的语法:element.addEventListener(event, function, useCapture);

第一个参数是事件的类型,如click或者mousedown,注意前面都没有on

第二个是事件触发后调用的函数

第三个参数为布尔值,可选,默认值为false,即冒泡传递

例如

<button id="myBtn">点我</button>
<script>
    document.getElementById("myBtn").addEventListener("click", function(){alert("Hello World!");});
</script>
<button id="myBtn">点我</button>
<script>
    document.getElementById("myBtn").addEventListener("click", myFunction);
    function myFunction() {alert ("Hello World!");}
</script>

上述第一种情况时直接写明函数与内容,第二种情况是通过函数名调用函数,这两种情况是等价的,并且与直接给元素添加事件是等价的。

注意,直接给元素添加事件时,是通过‘函数名()‘指明事件的,函数名后面有括号,并且整体通过‘‘引用,而添加事件句柄时,直接通过函数名引用,没有括号也没有引号。

<button id="myBtn" onclick=‘myFunction()‘>点我</button>
<script>
    function myFunction() {alert ("Hello World!");}
</script>

 

DOM EventListener

标签:等价   lse   cap   get   func   函数   类型   事件   语法   

原文地址:https://www.cnblogs.com/Forever77/p/10269550.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!