<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
function mouse_move(obj){
var msg = "当鼠标移动事件--->"+event.clientX+"——"+event.clientY;
obj.innerHTML = msg;
console.log(msg);
}
function mouse_over(obj){
var msg = "鼠标悬停事件--->"+event.clientX+"——"+event.clientY;
obj.innerHTML = msg;
console.log(msg);
}
function mouse_out(obj){
var msg = "鼠标移除事件--->"+event.clientX+"——"+event.clientY;
obj.innerHTML = msg;
console.log(msg);
}
function mouse_down(obj){
var msg = "鼠标按下去事件--->"+event.clientX+"——"+event.clientY;
obj.innerHTML = msg;
console.log(msg);
}
function mouse_up(obj){
var msg = "鼠标按下去之后松开事件--->"+event.clientX+"——"+event.clientY;
obj.innerHTML = msg;
console.log(msg);
}
function mouse_click(obj){
var msg = "鼠标单击--->"+event.clientX+"——"+event.clientY;
obj.innerHTML = msg;
console.log(msg);
}
function mouse_dblclick(obj){
var msg = "鼠标双击--->"+event.clientX+"——"+event.clientY;
obj.innerHTML = msg;
console.log(msg);
}
</script>
</head>
<body >
<div style="width: 200px; height: 200px; background-color: chartreuse;"
onmousemove="mouse_move(this)"
onmouseout="mouse_out(this)"
onmousedown="mouse_down(this)"
onmouseup="mouse_up(this)"
onclick="mouse_click(this)"
ondblclick="mouse_dblclick(this)"
onmouseover="mouse_over(this)">
</div>
</body>
</html>
