js获得网页中某元素的坐标位置

最新推荐文章于 2024-06-07 10:30:53 发布

pairsfish

最新推荐文章于 2024-06-07 10:30:53 发布

阅读量1.8k

点赞数

分类专栏： javascript 文章标签： div function bt html css

本文链接：https://blog.csdn.net/liuyanghai/article/details/7967610

版权

javascript 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

当某个元素的父元素进行了CSS定位时（absolute或者relative），则这个元素的offsetParent属性的取值为其父元素。更确切地说，这个元素的各种偏移量计算（offsetTop、offsetLeft等）的参照物为其父元素。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>javascript元素坐标</title>
<script type="text/javascript">
function mouse(o) {
   //（div）元素的偏离父元素顶部
  var dbt=o.offsetTop;
  //（div）元素的偏离父元素左边
var dbl=o.offsetLeft;
//（div）元素的宽度
var ofW=o.offsetWidth;
   //（div）元素的长度
var ofH=o.offsetHeight;
alert("dbt:"+dbt+" dbl:"+dbl+" ofW:"+ofW+" ofH:"+ofH);

//o.offsetParent　当前元素的父元素

                                        while(o=o.offsetParent)
                                        {
                                                dbl+=o.offsetLeft;
                                                dbt+=o.offsetTop;
                                        }
}
</script>

</head>
<body>
<div id="testDiv" οnclick="mouse(this)" style="background-color:red;width:200px;height:400px">放在我上面</div>
</body>
</html>

//qq空间放在人名上弹出div位置：

function mouse(o) {
　var h=132;
var dbt=o.offsetTop;
var dbl=o.offsetLeft;
var ofH=o.offsetHeight;
while(o=o.offsetParent)
{
    dbl+=o.offsetLeft;
    dbt+=o.offsetTop;
}
var bt=document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;
   wh=dbwindowHeight();
   var b=wh-(dbt-bt)-ofH;
   if(b>h) h=dbt+ofH; else h=dbt-h;
// newDiv.style.top = h+"px";　//设置div的位置
// newDiv.style.left = dbl+"px";
alert("h:"+h+" dbl:"+dbl+" dbt:"+dbt);
}

function dbwindowHeight() {
var E = document.documentElement;
return self.innerHeight || (E && E.clientHeight) || document.body.clientHeight;
}

pairsfish

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
js获得网页中某元素的坐标位置

当某个元素的父元素进行了CSS定位时（absolute或者relative），则这个元素的offsetParent属性的取值为其父元素。更确切地说，这个元素的各种偏移量计算（offsetTop、offsetLeft等）的参照物为其父元素。 javascript元素坐标 function mouse(o) { //（div）元素的偏离父元素顶部 var
复制链接

扫一扫

专栏目录