JavaScript中绑定事件的方式有哪些?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。
<强> JavaScript三种绑定事件的方式:
1。
& lt; div id=癰tn", onclick=癱lickone()“祝辞& lt;/div>,//直接在DOM里绑定事件
& lt; script>
function clickone(){,警报(“hello");,}
& lt;/script> 2。
& lt; div id=癰tn"祝辞& lt;/div>
& lt; script>
. getelementbyid (“btn") .onclick =,函数(){,警报(“hello");,},//脚本里面绑定
& lt;/script> 3。
& lt; div id=癰tn"祝辞& lt;/div>
& lt; script>
. getelementbyid (“btn") .addeventlistener (“click" clickone,假),,//通过侦听事件处理相应的函数
function clickone(){,警报(“hello");,}
& lt;/script> 那么问题来了,1和2的方式是我们经常用到的,那么既然已经有两种绑定事件的方法为什么还要有第三种呢?答案是这样的:
用“addeventlistener"可以绑定多次同一个事件,且都会执行,而在DOM结构如果绑定两个“onclick"事件,只会执行第一个;在脚本通过匿名函数的方式绑定的只会执行最后一个事件。
1。
& lt; div id=癰tn", onclick=癱lickone ()“, onclick=癱licktwo()“祝辞& lt;/div>
& lt; script>
function clickone(){,警报(“hello");,},//执行这个
function clicktwo(){,警报(“世界!“);,}
& lt;/script> 2。
& lt; div id=癰tn"祝辞& lt;/div>
& lt; script>
. getelementbyid (“btn") .onclick =,函数(){,警报(“hello");,}
. getelementbyid (“btn") .onclick =,函数(){,警报(“world");,},//执行这个
& lt;/script> 3。
& lt; div id=癰tn"祝辞& lt;/div>
& lt; script>
. getelementbyid (“btn") .addeventlistener (“click" clickone,假);
function clickone(){,警报(“hello");,},//先执行
. getelementbyid (“btn") .addeventlistener (“click" clicktwo,假);
function clicktwo(){,警报(“world");,},//后执行
& lt;/script> 看完上述内容是否对您有帮助呢?如果还想对相关知识有进一步的了解或阅读更多相关文章,请关注行业资讯频道,感谢您对的支持。
