<script>
let a = document.querySelector('.a')
// 点击事件
a.onclick = function(){
console.log('点击事件');
}
// 双击事件（在两次点击事件后触发）
a.ondblclick = function(){
console.log('双击事件');
}
// 鼠标右键点击事件
a.oncontextmenu = function(){
console.log('右键事件');
}
// 鼠标进入事件 (onmouseover比onmouseenter先执行)
a.onmouseenter = function(){
console.log('鼠标进入enter');
}
a.onmouseover = function(){
console.log('鼠标进入over');
}
// 鼠标离开事件（onmouseout比onmouseleave先执行）
a.onmouseleave = function(){
console.log('鼠标离开leave');
}
a.onmouseout = function(){
console.log('鼠标离开out');
}
// 注意：如果元素里面存在子元素，鼠标在子元素中移动时会反复触发 onmouseover 和 onmouseout
// 鼠标移动事件（所有的事件方法，都有一个默认的参数：事件对象）
a.onmousemove = function(e){
// 获取鼠标指针位置
let {offsetX,offsetY} = e
// console.log('鼠标移动',offsetX,offsetY);
}
// 鼠标按下事件
a.onmousedown = function(){
console.log('鼠标按下');
}
// 鼠标弹起
a.onmouseup = function(){
console.log('鼠标弹起');
}
