java script 获取对象坐标

function getElementPos(elementId) {

var ua = navigator.userAgent.toLowerCase();

var isOpera = (ua.indexOf('opera') != -1);

var isIE = (ua.indexOf('msie') != -1 && !isOpera); // not opera spoof

var el = document.getElementById(elementId);

if(el.parentNode === null || el.style.display == 'none') {

  return false;

}      

var parent = null;

var pos = [];     

var box;     

if(el.getBoundingClientRect)    //IE

{         

   box = el.getBoundingClientRect();

  var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);

  var scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);

  return {x:box.left + scrollLeft, y:box.top + scrollTop};

}else if(document.getBoxObjectFor)    // gecko    

{

   box = document.getBoxObjectFor(el);

  var borderLeft = (el.style.borderLeftWidth)?parseInt(el.style.borderLeftWidth):0;

  var borderTop = (el.style.borderTopWidth)?parseInt(el.style.borderTopWidth):0;

   pos = [box.x - borderLeft, box.y - borderTop];

} else    // safari & opera    

{

   pos = [el.offsetLeft, el.offsetTop];  

   parent = el.offsetParent;     

  if (parent != el) {

   while (parent) {  

     pos[0] += parent.offsetLeft;

     pos[1] += parent.offsetTop;

     parent = parent.offsetParent;

    }  

   }   

  if (ua.indexOf('opera') != -1 || ( ua.indexOf('safari') != -1 && el.style.position == 'absolute' )) {

    pos[0] -= document.body.offsetLeft;

    pos[1] -= document.body.offsetTop;         

   }    

}              

if (el.parentNode) {

     parent = el.parentNode;

    } else {

     parent = null;

    }

while (parent && parent.tagName != 'BODY' && parent.tagName != 'HTML') { // account for any scrolled ancestors

   pos[0] -= parent.scrollLeft;

   pos[1] -= parent.scrollTop;

  if (parent.parentNode) {

    parent = parent.parentNode;

   } else {

    parent = null;

   }

}

return {x:pos[0], y:pos[1]};

}

//sample

var pos=getElementPos("divId");

alert("距左边距离"+ pos.x +",距上边距离"+pos.y);

js获取对象的绝对坐标

function   getAbsPoint(e)  

{  

    var   x   =   e.offsetLeft,   y   =   e.offsetTop;  

    while(e=e.offsetParent)

    {

       x   +=   e.offsetLeft;  

       y   +=   e.offsetTop;

    }

    alert("x:"+x+","+"y:"+y);  

}

方法2:

function   getAbsPoint(obj)  

{  

   var   x,y;  

   oRect   =   obj.getBoundingClientRect();  

x=oRect.left  

y=oRect.top  

alert("("+x+","+y+")")  

}

ADD:获取应用中的其他.

js获取页面控件坐标

 

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script type="text/javascript">

        function get_Text()

{

                                          m = document.getElementById("mxh")

var w=0,h=0;

                                          while(m.offsetParent)

                                          {

                                                        w += m.offsetLeft;

                                                        h += m.offsetTop;

                                                        m = m.offsetParent;

                                          }

                                          alert(w)

        }

    </script>

</head>

<body>

sdsdddddd<img src="http://www.google.com/help/hc/images/google_logo_sm.gif" id="mxh" />

    <input type="button" value="get" onclick="get_Text()"/>

</body>

</html>

 

标签属性   属性   描述    
   
  ALIGN   align  
设置或获取表格排列。
   
  ALLOWTRANSPARENCY   allowTransparency  
设置或获取对象是否可为透明。
   
  APPLICATION   APPLICATION  
表明对象的内容是否为   HTML   应用程序(HTA),以便免除浏览器安全模式。
   
  ATOMICSELECTION  
指定元素及其内容是否可以一不可见单位统一选择。
   
  BEGIN   begin  
设置或获取时间线在该元素上播放前的延迟时间。
   
  BORDER   border  
设置或获取框架间的空间,包括   3D   边框。
   
  canHaveChildren  
获取表明对象是否可以包含子对象的值。
   
  canHaveHTML  
获取表明对象是否可以包含丰富的   HTML   标签的值。
   
  CLASS   className  
设置或获取对象的类。
   
  contentWindow  
获取指定的   frame     iframe     window   对象。
   
  DATAFLD   dataFld  
设置或获取由   dataSrc   属性指定的绑定到指定对象的给定数据源的字段。
   
  DATASRC   dataSrc  
设置或获取用于数据绑定的数据源。
   
  disabled  
获取表明用户是否可与该对象交互的值。
   
  END   end  
设置或获取表明元素结束时间的值,或者元素设置为重复的简单持续终止时间。
   
  firstChild  
获取对象的   childNodes   集合的第一个子对象的引用。
   
  FRAMEBORDER   frameBorder  
设置或获取是否显示框架的边框。
   
  hasMedia  
获取一个表明元素是否为   HTML+TIME   媒体元素的   Boolean   值。
   
  HEIGHT   height  
设置或获取对象的高度。
   
  HIDEFOCUS   hideFocus  
设置或获取表明对象是否显式标明焦点的值。
   
  HSPACE   hspace  
设置或获取对象的水平边距。
   
  ID   id  
获取标识对象的字符串。
   
  innerText  
设置或获取位于对象起始和结束标签内的文本。
   
  isContentEditable  
获取表明用户是否可编辑对象内容的值。
   
  isDisabled  
获取表明用户是否可与该对象交互的值。
   
  isMultiLine  
获取表明对象的内容是包含一行还是多行的值。
   
  isTextEdit  
获取是否可使用该对象创建一个   TextRange   对象。
   
  LANG   lang  
设置或获取要使用的语言。
   
  LANGUAGE   language  
设置或获取当前脚本编写用的语言。
   
  lastChild  
获取该对象   childNodes   集合中最后一个子对象的引用。
   
  longDesc  
设置或获取对象长描述的统一资源标识符(URI)
   
  MARGINHEIGHT   marginHeight  
设置或获取显示框架中文本之前的上下边距高度。
   
  MARGINWIDTH   marginWidth  
设置或获取显示框架中文本之前的左右边距宽度。NAME   name   设置或获取框架的名称。
   
  nextSibling  
获取对此对象的下一个兄弟对象的引用。
   
  nodeName  
获取特定结点类型的名称。
   
  nodeType  
获取所需结点的类型。
   
  nodeValue  
设置或获取结点的值。
   
  offsetHeight  
获取对象相对于版面或由父坐标   offsetParent   属性指定的父坐标的高度。
   
  offsetLeft  
获取对象相对于版面或由   offsetParent   属性指定的父坐标的计算左侧位置。
   
  offsetParent  
获取定义对象   offsetTop     offsetLeft   属性的容器对象的引用。
   
  offsetTop  
获取对象相对于版面或由   offsetTop   属性指定的父坐标的计算顶端位置。
   
  offsetWidth  
获取对象相对于版面或由父坐标   offsetParent   属性指定的父坐标的宽度。
 
  onOffBehavior  
获取表明指定的   Microsoft&reg;   DirectAnimation&reg;   行为是否正在运行的对象。
   
  outerHTML  
设置或获取对象及其内容的   HTML   形式。
   
  outerText  
设置或获取对象的文本。
   
  ownerDocument  
设置或获取结点关联的   document   对象。
   
  parentElement  
获取对象层次中的父对象。
   
  parentNode  
获取文档层次中的父对象。
   
  parentTextEdit  
获取文档层次中可用于创建包含原始对象的   TextRange   的容器对象。
 
  previousSibling  
获取对此对象的上一个兄弟对象的引用。
   
  readyState  
获取对象的当前状态。
   
  readyState  
获取表明对象当前状态的值。
   
  recordNumber  
获取数据集中生成对象的原始记录。
   
  scopeName  
获取为该元素定义的命名空间。
   
  SCROLLING   scrolling  
设置或获取框架是否可被滚动。
   
  SECURITY   SECURITY  
获取表明   frame     iframe   的源文件是否应用了特定的安全限制的值。
   
  sourceIndex  
获取对象在源序中的依次位置,即对象出现在   document     all   集合中的顺序。
   
  SRC   src  
设置或获取要由对象装入的   URL
   
  STYLE  
为该设置元素设置内嵌样式。
   
  SYNCMASTER   syncMaster  
设置或获取时间容器是否必须在此元素上同步回放。
   
  SYSTEMBITRATE  
获取系统中大约可用带宽的   bps
   
  SYSTEMCAPTION  
表明是否要显示文本来代替演示的的音频部分。
   
  SYSTEMLANGUAGE  
表明是否在用户计算机上的选项设置中选中了给定语言。
   
  SYSTEMOVERDUBORSUBTITLE  
指定针对那些正在观看演示但对被播放的音频所使用的语言并不熟悉的用户来说是否要渲染配音或字幕。
   
  TABINDEX   tabIndex  
设置或获取定义对象的   Tab   顺序的索引。
   
  tagName  
获取对象的标签名称。
   
  tagUrn  
设置或获取在命名空间声明中指定的统一资源名称(URN)
   
  TIMECONTAINER   timeContainer  
设置或获取与元素关联的时间线类型。
   
  TITLE   title  
设置或获取对象的咨询信息(工具提示)
   
  uniqueID  
获取为对象自动生成的唯一标识符。
   
  UNSELECTABLE  
指定该元素不可被选中。
   
  VSPACE   vspace  
设置或获取对象的垂直边距。
   
  WIDTH   width  
设置或获取对象的宽度。  

posted on 2011-08-03 13:14  破阵子 . 如是我闻  阅读(638)  评论(0编辑  收藏  举报

导航