鼠标移动：mousemove

鼠标按下：mousedown

鼠标释放：mouseup

点击事件：click

<body>
<div class="box"></div>
<script>
　　var box=document.getElementById("box");
　　box.onmousedown=function(e){
　　　box.innerHTML="x的位置"+e.clientX+"y的位置"+e.clientY
　　}
　　box.onmouseup=function(e){
　　　box.innerHTML="x的位置"+e.clientX+"y的位置"+e.clientY
　　}
　　box.onmousemove=function(e){
　　　box.innerHTML="x的位置"+e.clientX+"y的位置"+e.clientY
　　}
　　
　　box.onclick=function(e){
　　　box.innerHTML="x的位置"+e.clientX+"y的位置"+e.clientY
　　}
//当鼠标按下，鼠标释放，和点击事件同时执行的时候，系统依次执行鼠标按下、鼠标释放、鼠标点击。
//获取X、Y的位置有两种方法。
1.    e.clientX  e.clientY   此方法是按照窗口左上角为原点进行获取的。
2.    e.pageX  e.pageY   此方法是按照文档左上角为原点进行获取的。
 
</script>
</body>

事件委托：将子元素将要执行的事件委托给父元素，父元素执行事件时，通过事件对象，来判断是哪个子元素触发的事件。

事件冒泡：事件由内部向外部传播，外层如果有相同的事件，也会触发