<script type="text/javascript">
window.onload = function(){
// 抓取元素
var box = document.getElementById("box");
// 添加点击事件
box.onclick = function(e){
// document.all判断是否是IE浏览器
// if(document.all){
ie获取事件对象的方法
// var e = window.event;
// }else{
非ie获取事件对象的方法
// var e = e;
// }
// 短路写法获取事件对象
var e = e||window.event;
// 获得鼠标距离浏览器左侧的距离
// var left = e.clientX;
// 获得鼠标距离浏览器顶部的距离
// var top = e.clientY;
// 短路写法获取事件对象
var e = e||window.event;
// e.layerX非IE或点击位置距离事件源左侧的距离
// 注意:在非ie获取的鼠标位置的时候一定要给事件源添加定位属性
// e.offsetX 在IE下获得点击位置距离事件源左侧的距离
var left = e.offsetX||e.layerX;
var top = e.offsetY||e.layerY;
// 将位置放到title标签里
document.title = left+'|'+top;
}
}
window.onload = function(){
// 抓取元素
var box = document.getElementById("box");
// 添加点击事件
box.onclick = function(e){
// document.all判断是否是IE浏览器
// if(document.all){
ie获取事件对象的方法
// var e = window.event;
// }else{
非ie获取事件对象的方法
// var e = e;
// }
// 短路写法获取事件对象
var e = e||window.event;
// 获得鼠标距离浏览器左侧的距离
// var left = e.clientX;
// 获得鼠标距离浏览器顶部的距离
// var top = e.clientY;
// 短路写法获取事件对象
var e = e||window.event;
// e.layerX非IE或点击位置距离事件源左侧的距离
// 注意:在非ie获取的鼠标位置的时候一定要给事件源添加定位属性
// e.offsetX 在IE下获得点击位置距离事件源左侧的距离
var left = e.offsetX||e.layerX;
var top = e.offsetY||e.layerY;
// 将位置放到title标签里
document.title = left+'|'+top;
}
}
</script>
html//
<div id="box">
</div>
css
<style type="text/css">
#box{
width: 200px;
height: 200px;
background: yellow;
margin-left: 500px;
margin-top: 200px;
position: relative;
}
</style>