获得div的相对和绝对位置

最新推荐文章于 2023-02-01 16:34:48 发布

nailwl

最新推荐文章于 2023-02-01 16:34:48 发布

阅读量3.3k

点赞数

文章标签： div generator function xhtml html 测试

本文链接：https://blog.csdn.net/nailwl/article/details/4359592

版权

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />

</head>

<body οnlοad="getabspos();">
<div id="mydiv" >
我在这里，我现在的相对绝对位置是一样的。<br />
你可以根据具体情况来改变我的位置，测试后肯定是可以使用的。<br />
</div>

//这里是为了兼容，因为做了第一行doctype的声明，document.body是得不到的，或者得到的是空对象。
function getBodyObj() { return (document.documentElement)?document.documentElement:document.body; }

function getabspos()
{
  //得到绝对位置：
  while(e = e.offsetParent)
  {
   t += e.offsetTop;
   l += e.offsetLeft;
  }
  alert("abs_Left: " + l + "abs_Top: " + t);

//得到相对位置：绝对位置减去document.body.scrollLeft和document.body.scrollTop就是相对位置。
alert("rel_Left: " + (l-getBodyObj().scrollLeft) + "rel_Top: " +(t-getBodyObj().scrollTop));
}
//-->
</script>
</body>
</html>