关于点击事件onclick 和 addEventListener的思考
box.onclick = function(){
console.log('onclick 点击');
box.addEventListener('click', function(){
console.log('EventListener 点击');
onclick 和 addEventListener 联系
两者都可以监听到点击事件
onclick 和 addEventListener 区别
on执行事件的特点:
如果多次执行,会覆盖掉之前的执行,只保留最后一次
addEventListener执行事件的特点:
所有的事件都会被触发,遵循的是冒泡规律
addEventListener
element.addEventListener(event, function, useCapture)
假如有一个盒子,在页面的某一个地方,我需要监听盒子的点击。在请求完之后,我需要再次监听盒子的点击。也就是说,盒子会被多次点击,但是每次点击执行的东西不一样。
可以这样写:
box.onclick = function(){
console.log('onclick 电击');
box.onclick = function(){
console.log('onclick 二次点击');
思考一下,这样写有没有逻辑问题?语法问题?执行后是什么效果?
答案是:始终执行第二次,第一次点击被覆盖掉了
真正的需求是,每次点击都必须监听到,所以嘞?
box.addEventListener('click', function(){
console.log('EventListener 点击');