event.x,event.clientX,event.offsetX区别_javascript技巧

x:设置或者是得到鼠标相对于目标事件的父元素的外边界在x坐标上的位置。
clientX:相对于客户区域的x坐标位置，不包括滚动条，就是正文区域。
offsetx：设置或者是得到鼠标相对于目标事件的父元素的内边界在x坐标上的位置。
screenX:相对于用户屏幕。
测试代码一:
[code]

<script> <BR>function reload(){ <BR>window.location.reload("http://www.jb51.net"); <BR>} <BR></script>





 















<script> <BR>function window.onbeforeunload() <BR>{ <BR>alert('event.clientX='+event.clientX);//如果是鼠标点击“刷新”按钮，则跟鼠标点击时的位置有关 <BR>alert('event.offsetX='+event.offsetX); <BR>alert('document.body.clientWidth='+document.body.clientWidth); <BR>alert('event.clientY='+event.clientY); <BR>alert('event.offsetY='+event.offsetY); <BR>alert('event.altKey='+event.altKey); <BR>if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey) <BR>{ <BR>window.event.returnValue="确定要退出本页吗?"; <BR>}else <BR>{ <BR>alert("你在刷新"); <BR>} <BR>} <BR></script>
[/html]
演示代码二:

<table border="1" cellpadding="15" cellspacing="15" style="position:relative;left:100;top:100"> <tr><td> <div onclick="show()" style="background:silver;cursor:hand"> Click here to show. </div> </td></tr> </table> <script> function show(){ alert("window.event.x:"+window.event.x+"\nwindow.event.y:"+window.event.y+"\nevent.clientX:"+event.clientX+"\nevent.clientY:"+event.clientY+"\nevent.offsetX:"+event.offsetX+"\nevent.offsetY:"+event.offsetY+"\nwindow.event.screenX:"+window.event.screenX+"\nwindow.event.screenY:"+window.event.screenY); } </script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]