常见dom事件

常见的鼠标事件：

<!-- 1.click点击事件 -->
<button onclick="alert('hello world!')">点我试试</button>

<!-- 2.dblclick双击事件 -->
<button ondblclick="alert('双击了')">双击</button>

<!-- 3.mouseenter鼠标进入目标元素内的事件 -->
<div onmouseenter="console.log('hello world')"></div>

 <!-- 4.mouseleave鼠标离开目标元素内的事件 -->
<div onmouseleave="console.log('hello world!!!!')"></div>
 
<!-- 5.mousemove鼠标在目标元素上移动内的事件 -->
 <div onmousemove="console.log('hello world....')"></div>

<!-- 6.mousedown鼠标在目标元素上按下按键的事件 -->
<div onmousedown="console.log('hello world down')"></div>

<!-- 7.mouseup鼠标在目标元素上抬起按键的事件 -->
<div onmouseup="console.log('hello world up')"></div>

<!-- 8.mousewheel鼠标在目标元素上滚动滚轮的事件 目前部分浏览器可能已经废弃 可以使用onwheel代替-->
<div onmousewheel="console.log('hello world wheel')"></div>
<div onwheel="console.log('hello world wheel...')"></div>


<!-- 上面的各种事件的写法一般会使用下边的方式代替 -->
<!-- 下面代码意思是当div被点击之后立即去调用名字为myClick() 的功能代码-->
<div onclick="myClick()"></div>

<!-- 思考：如果有100个div被点击后，要把背景色改成不同的颜色 怎么办？ -->
<div onclick="myClick2(event)" id="xxx"></div>
<div onclick="myClick2(event)"></div>
<div onclick="myClick2(event)"></div>