JS 获取页面元素坐标

最新推荐文章于 2021-06-17 19:05:33 发布

转载最新推荐文章于 2021-06-17 19:05:33 发布 · 1.8w 阅读

JS/HTML/CSS 专栏收录该内容

12 篇文章

订阅专栏

本文介绍了如何使用JavaScript来获取和设置HTML元素的位置与尺寸，包括通过offsetLeft、offsetTop等属性获取元素坐标，以及利用style属性修改元素的宽度、高度。

javascript(获取或设置html元素的宽,高,坐标)
设置:

    document.getElementById('id').style.width=value
    document.getElementById('id').style.height=value
    document.getElementById('id').style.top=value
    document.getElementById('id').style.left=value

获取:

    value=document.getElementById('id').offsetLeft
    value=document.getElementById('id').offsetTop
    value=document.getElementById('id').offsetWidth
    value=document.getElementById('id').offsetHeight

找一个元素的坐标：

function findPosition( oElement )
{
  var x2 = 0;
  var y2 = 0;
  var width = oElement.offsetWidth;
  var height = oElement.offsetHeight;
  alert(width + "=" + height);
  if( typeof( oElement.offsetParent ) != 'undefined' )
  {
    for( var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent )
    {
      posX += oElement.offsetLeft;
      posY += oElement.offsetTop;     
    }
    x2 = posX + width;
    y2 = posY + height;
    return [ posX, posY ,x2, y2];
   
    } else{
      x2 = oElement.x + width;
      y2 = oElement.y + height;
      return [ oElement.x, oElement.y, x2, y2];
  }
}