如何取得对象到页面顶部及左边的距离???

<html>
<body>
<table border=0 cellpadding=0 cellspacing=0> 
<tr><td>首页</td><td>菜单一</td><td>菜单二</td></tr>
</table>
<table>
<tr>
<td>
序列号：
</td>
<td>
<div id="datatable">
        <table>
        <tr>
        <td>first Name</td>
        <td>last name</td>
        </tr>
        </table>
</div>
</td>
</tr>
</table>
<input onclick="getIT()" type=button>
<script>
function getIT()
{
var offx = 0;
var sObject = document.getElementById("datatable");
var offy = 0
var ndObject = sObject;
while (ndObject.nodeName != "BODY")
{
    offx += ndObject.offsetLeft;
    offy += ndObject.offsetTop;
    ndObject = ndObject.offsetParent;
}
alert(offx)
alert(offy)
}
</script>
</body>
</html>

解决方案 »

  1.   

    由于浏览器对Body的定义不同，要想得到完全一样的值，请定义Body边框属性
    <html>
    <body style="margin:0px;padding:0;border:0px">
    <table border=0 cellpadding=0 cellspacing=0> 
    <tr><td>首页</td><td>菜单一</td><td>菜单二</td></tr>
    </table>
    <table>
    <tr>
    <td>
    序列号：
    </td>
    <td>
    <div id="datatable">
            <table>
            <tr>
            <td>first Name</td>
            <td>last name</td>
            </tr>
            </table>
    </div>
    </td>
    </tr>
    </table>
    <input onclick="getIT()" type=button>
    <script>
    function getIT()
    {
    var offx = 0;
    var sObject = document.getElementById("datatable");
    var offy = 0
    var ndObject = sObject;
    while (ndObject.nodeName != "BODY")
    {
        offx += ndObject.offsetLeft;
        offy += ndObject.offsetTop;
        ndObject = ndObject.offsetParent;
    }
    alert(offx)
    alert(offy)
    }</script>
    </body>
    </html>
      

  2.   

    getAbsPoint=function(e){
    var x = e.offsetLeft, y = e.offsetTop;
    while(e=e.offsetParent){x += e.offsetLeft; y += e.offsetTop;}
    var oPoint={"x": x, "y": y};
    alert(oPoint.x);
    alert(oPoint.y);
    return oPoint;
    }