关于offsetParent

元素的offsetParent可能值：null，body元素，该元素的某个父级定位元素。

 

为null的情况：

　　1. body元素

　　2. 元素的display为none

　　3. 元素尚未添加到DOM

　　4. 元素的position为fixed

为body元素的情况：

　　该元素不是任何一个定位元素的后代，也不是null。

为某个父级定位元素的情况：

　　如果此元素是某个定位元素的子级，离它最近的父级定位元素为此元素的offsetParent；如果此元素不是某个定位元素的子级，但其父元素中有td、th或者table，那么其offsetParent为上述元素。

 

获取元素相对于页面的位置：

function(elem) {
	if (elem.getBoundingClientRect) { //HTML5 method
		var box = elem.getBoundingClientRect();
		var body = document.body;
		var docElem = document.documentElement;
		var scrollTop = window.pageYOffset || docElem.scrollTop || body.scrollTop;
		var scrollLeft = window.pageXOffset || docElem.scrollLeft || body.scrollLeft;
		var clientTop = docElem.clientTop || body.clientTop || 0;
		var clientLeft = docElem.clientLeft || body.clientLeft || 0;
		var top  = box.top +  scrollTop - clientTop;
		var left = box.left + scrollLeft - clientLeft;
		return { y: Math.round(top), x: Math.round(left), width:elem.offsetWidth, height:elem.offsetHeight };
	} else { //fallback to naive approach
		var top=0, left=0;
		while(elem) {
			top = top + parseInt(elem.offsetTop,10);
			left = left + parseInt(elem.offsetLeft,10);
			elem = elem.offsetParent;
		}
		return { y: top, x: left, width:elem.offsetHeight, height:elem.offsetWidth };
	}
}

　　

 

转载于:https://www.cnblogs.com/ywxgod/p/6481247.html