DOM中Event對(duì)象
DOM中引入Event對(duì)象(DOM瀏覽器就是標(biāo)準(zhǔn)瀏覽器)
（1）通過(guò)HTML標(biāo)記的事件屬性來(lái)傳遞event對(duì)象
在DOM中，event對(duì)象是作為事件調(diào)用函數(shù)時(shí)的參數(shù)，傳遞給函數(shù)的。
該event參數(shù)，是系統(tǒng)固定寫法，全小寫，不能加引號(hào)，它就是event對(duì)象參數(shù)
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>php.cn</title>
<script type="text/javascript">
//在HTML中，如何通過(guò)事件來(lái)傳遞event對(duì)象參數(shù)
function get(e){
//獲取單擊時(shí)，距離窗口左邊和上邊的距離
alert(e.clientX+","+e.clientY);
}
</script>
</head>
<body style="margin:0px">
<img width="400" src="/upload/course/000/000/009/580af7f52278b486.jpg" onclick="get(event)" />
</body>
</html>（2）使用元素對(duì)象的事件屬性來(lái)傳遞event對(duì)象
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>php.cn</title>
<script type="text/javascript">
window.onload = function(){
//獲取id=img1的圖片對(duì)象
var imgObj=document.getElementById("img1");
//增加onclick事件
imgObj.onclick=get;
}
//不能傳event參數(shù)，但形參必須接收
//第一個(gè)形參，一定是event對(duì)象
function get(e){
//獲取單擊時(shí)，距離窗口左邊和上邊的距離
alert(e.clientX+","+e.clientY);
}
</script>
</head>
<body style="margin:0px">
<img id="img1" width="400" src="/upload/course/000/000/009/580af7f52278b486.jpg" />
</body>
</html>DOM中Event對(duì)象屬性
type：當(dāng)前的事件類型
clientX和clientY：距離窗口左邊和上邊的距離
pageX和pageY：距離網(wǎng)頁(yè)左邊和上邊的距離
screenX和screenY：距離屏幕左邊和上邊的距離
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>php.cn</title>
<script type="text/javascript">
function get(e)
{
//獲取單擊時(shí)，相關(guān)坐標(biāo)信息
var str = "窗口左邊距離："+e.clientX+"，窗口頂邊距離："+e.clientY;
str += "\n網(wǎng)頁(yè)左邊距離："+e.pageX+"，網(wǎng)頁(yè)頂邊距離："+e.pageY;
str += "\n屏幕左邊距離："+e.screenX+"，屏幕頂邊距離："+e.screenY;
str += "\n事件類型："+e.type;
window.alert(str);
}
</script>
</head>
<body style="margin:0px">
<img id="img1" width="400" src="/upload/course/000/000/009/580af7f52278b486.jpg" onclick="get(event)" />
</body>
</html>
一輛想出軌的無(wú)軌電車
圖片不錯(cuò)。。好看。。。
8年前 添加回復(fù) 0