简介
有时（特别是在AJAX的项目），它是要得到一些quot DOM元素的位置; absolutequot;在当前文档中的坐标。例如，这样一个quot; absolutequot;位置是需要的，如果你想显示一些隐藏的DIV对象正是另一个元素的位置（或一些偏移）。我们使用此功能在我们的项目之一，到下一个文本标签显示一个弹出菜单。解决方案
等特性style.left，style.top，或offsetLeft，offsetTop可以在它的父元素的位置，用来获取（或设置）。因此，要在文档中的元素的绝对位置，我们应该向上移动元素的树和添加所有元素的父母（除最新的文档中的元素）位置。
然而，这是不太容易。还有一些问题:首先，我们需要考虑到可能的滚动元素的父母，并相应地减少我们的结果。第二，有一些区别（像往常一样:-(），在不同的浏览器的行为。对于Internet Explorer，我们永远只是减去滚动位置的元素的offsetParent属性中存储的对象，但对于Firefox，我们还需要采取考虑到所有的家长对于ParentNode属性访问。最后，我们应该考虑到一些父元素的边框宽度。不幸的是，这个任务也不是那么容易，因为它，特别是IE浏览器，可咋办。
所以，在这里我们得到的功能:

function __getIEVersion() {

    var rv = -1; // Return value assumes failure.

    if (navigator.appName == 'Microsoft Internet Explorer') {

        var ua = navigator.userAgent;

        var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");

        if (re.exec(ua) != null)

            rv = parseFloat(RegExp.$1);

    }

    return rv;

}



function __getOperaVersion() {

    var rv = 0; // Default value

    if (window.opera) {

        var sver = window.opera.version();

        rv = parseFloat(sver);

    }

    return rv;

}



var __userAgent = navigator.userAgent;

var __isIE =  navigator.appVersion.match(/MSIE/) != null;

var __IEVersion = __getIEVersion();

var __isIENew = __isIE && __IEVersion >= 8;

var __isIEOld = __isIE && !__isIENew;



var __isFireFox = __userAgent.match(/firefox/i) != null;

var __isFireFoxOld = __isFireFox && ((__userAgent.match(/firefox\/2./i) != null) || 

	(__userAgent.match(/firefox\/1./i) != null));

var __isFireFoxNew = __isFireFox && !__isFireFoxOld;



var __isWebKit =  navigator.appVersion.match(/WebKit/) != null;

var __isChrome =  navigator.appVersion.match(/Chrome/) != null;

var __isOpera =  window.opera != null;

var __operaVersion = __getOperaVersion();

var __isOperaOld = __isOpera && (__operaVersion < 10);



function __parseBorderWidth(width) {

    var res = 0;

    if (typeof(width) == "string" && width != null && width != "" ) {

        var p = width.indexOf("px");

        if (p >= 0) {

            res = parseInt(width.substring(0, p));

        }

        else {

     		//do not know how to calculate other values 

		//(such as 0.5em or 0.1cm) correctly now

    		//so just set the width to 1 pixel

            res = 1; 

        }

    }

    return res;

}



//returns border width for some element

function __getBorderWidth(element) {

	var res = new Object();

	res.left = 0; res.top = 0; res.right = 0; res.bottom = 0;

	if (window.getComputedStyle) {

		//for Firefox

		var elStyle = window.getComputedStyle(element, null);

		res.left = parseInt(elStyle.borderLeftWidth.slice(0, -2));  

		res.top = parseInt(elStyle.borderTopWidth.slice(0, -2));  

		res.right = parseInt(elStyle.borderRightWidth.slice(0, -2));  

		res.bottom = parseInt(elStyle.borderBottomWidth.slice(0, -2));  

	}

	else {

		//for other browsers

		res.left = __parseBorderWidth(element.style.borderLeftWidth);

		res.top = __parseBorderWidth(element.style.borderTopWidth);

		res.right = __parseBorderWidth(element.style.borderRightWidth);

		res.bottom = __parseBorderWidth(element.style.borderBottomWidth);

	}

   

	return res;

}



//returns the absolute position of some element within document

function getElementAbsolutePos(element) {

	var res = new Object();

	res.x = 0; res.y = 0;

	if (element !== null) { 

		if (element.getBoundingClientRect) {

			var viewportElement = document.documentElement;  

 	        var box = element.getBoundingClientRect();

		    var scrollLeft = viewportElement.scrollLeft;

 		    var scrollTop = viewportElement.scrollTop;



		    res.x = box.left + scrollLeft;

		    res.y = box.top + scrollTop;



		}

		else { //for old browsers

			res.x = element.offsetLeft;

			res.y = element.offsetTop;



			var parentNode = element.parentNode;

			var borderWidth = null;



			while (offsetParent != null) {

				res.x += offsetParent.offsetLeft;

				res.y += offsetParent.offsetTop;

				

				var parentTagName = 

					offsetParent.tagName.toLowerCase();	



				if ((__isIEOld && parentTagName != "table") || 

					((__isFireFoxNew || __isChrome) && 

						parentTagName == "td")) {		    

					borderWidth = kGetBorderWidth

							(offsetParent);

					res.x += borderWidth.left;

					res.y += borderWidth.top;

				}

				

				if (offsetParent != document.body && 

				offsetParent != document.documentElement) {

					res.x -= offsetParent.scrollLeft;

					res.y -= offsetParent.scrollTop;

				}





				//next lines are necessary to fix the problem 

				//with offsetParent

				if (!__isIE && !__isOperaOld || __isIENew) {

					while (offsetParent != parentNode && 

						parentNode !== null) {

						res.x -= parentNode.scrollLeft;

						res.y -= parentNode.scrollTop;

						if (__isFireFoxOld || __isWebKit) 

						{

						    borderWidth = 

						     kGetBorderWidth(parentNode);

						    res.x += borderWidth.left;

						    res.y += borderWidth.top;

						}

						parentNode = parentNode.parentNode;

					}    

				}



				parentNode = offsetParent.parentNode;

				offsetParent = offsetParent.offsetParent;

			}

		}

	}

    return res;

}

要使用此功能，只需在函数的参数传递你的元素，得到的结果与存储在X和Y属性相应的左侧和顶部坐标对象:{C}
getElementAbsolutePos功能是最常见的浏览器进行测试: Internet Explorer 6.0和更高版本Firefox 2.x的和更高歌剧9.x的和更高版本谷歌浏览器历史2009年4月，二十一日:战后初期4月28日，2009:文章更新4月20日，2011年:第二十更新