点击事件

绑定点击事件

click

html标签事件绑定：属性绑定，js中定义相应事件的函数。 （这个在该元素的properties属性中可以查到，也可以在事件监听中看到）

<button onclick="show()">show</button>

function show(){
　　console.log('show');
}

onclick

js事件绑定：属性赋值。（这个在该元素的properties属性中可以查到，也可以在事件监听中看到）

<button id="btn">show</button>

let btn = document.getElementById('btn');
 
btn.onclick = function(e) {
    //点击事件
    e.stopPropagation(); // 阻止冒泡到父级的点击事件
}

addEventListener

事件监听：只可以在该元素的事件监听中看到

<button id="btn">show</button>

let btn = document.getElementById('btn');

btn.addEventListener('click', function(e) {
//点击事件 e.stopPropagation();// 阻止冒泡到父级的点击事件 })

// 移除事件监听 document.getElementById("btn").removeEventListener("click");

如果父元素也有点击事件，这个会触发父元素的点击事件，需要阻止一下

## click与onclick 区别
click是真正地用程序去点击按钮，触发了按钮的onclick()事件
onclick只是简单地调用了btn的onclick所指向的方法，只是调用方法而已，并未触发事件