The Element.scrollHeight read-only attribute is a measurement of the height of an element‘s content, including content not visible on the screen due to overflow. The scrollHeight value is equal to the minimum height (where height includes padding but does not include border and margin) the element would require in order to fit all the content in the viewpoint without using a vertical scrollbar. It includes the element padding but not its margin.语法：var intElemScrollHeight = element.scrollHeight;

    The Element.scrollWidth read–only property returns either the width in pixels of the content of an element or the width of the element itself, whichever is greater. If the element is wider than its content area (for example, if there are scroll bars for scrolling through the content), the scrollWidth is larger than the clientWidth.语法：var xScrollWidth = element.scrollWidth;

    The Element.scrollTop property gets or sets the number of pixels that the content of an element is scrolled upward. An element‘s scrollTop is a measurement of the distance of an element‘s top to its topmost visible content. When an element content does not generate a vertical scrollbar, then its scrollTop value defaults to 0.

语法：
// Get the number of pixels scrolled 
var  intElemScrollTop = someElement.scrollTop;

// Set the number of pixels scrolled 
element.scrollTop = intValue;

    The Element.scrollLeft property gets or sets the number of pixels that an element‘s content is scrolled to the left.    Note that if the element‘s direction of the element is rtl (right-to-left) then scrollLeft is 0 when the scrollbar is at its rightmost position (at start of the scrolled content) and then increasingly negative as you scroll towards the end of the content.
 语法：

 // Get the number of pixels scrolled var sLeft = element.scrollLeft;

 // Set the number of pixels scrolled element.scrollLeft = 10;

　 The HTMLElement.offsetHeight read-only property is the height of the element including vertical padding and borders, in pixels, as an integer.   Typically, an element‘s offsetHeight is a measurement which includes the element borders, the element vertical padding, the element horizontal scrollbar (if present, if rendered) and the element CSS height.    In compliance with the specification, this property will return null on Webkit if the element is hidden (the style.display of this element or any ancestor is "none") or if the style.position of the element itself is set to "fixed".    This property will return null on Internet Explorer (9) if the style.position of the element itself is set to "fixed". (Having display:none does not affect this browser.)
语法：

var intElemOffsetHeight = document.getElementById(id_attribute_value).offsetHeight;

    The HTMLElement.offsetWidth read-only property returns the layout width of an element. Typically, an element‘s offsetWidth is a measurement which includes the element borders, the element horizontal padding, the element vertical scrollbar (if present, if rendered) and the element CSS width.
　　In compliance with the specification, this property will return null on Webkit if the element is hidden (the style.display of this element or any ancestor is "none") or if the style.positionof the element itself is set to "fixed".
　　This property will return null on Internet Explorer (9) if the style.position of the element itself is set to "fixed". (Having display:none does not affect this browser.)

语法：

var offsetWidth =element.offsetWidth;

    The HTMLElement.offsetTop read-only property returns the distance of the current element relative to the top of the offsetParent node.    topPos is the number of pixels from the top of the closest relatively positioned parent element.    In compliance with the specification, this property will return null on Webkit if the element is hidden (the style.display of this element or any ancestor is "none") or if the style.position of the element itself is set to "fixed".    This property will return null on Internet Explorer (9) if the style.position of the element itself is set to "fixed". (Having display:none does not affect this browser.)语法：var topPos = element.offsetTop;

    The HTMLElement.offsetLeft read-only method returns the number of pixels that the upper left corner of the current element is offset to the left within the HTMLElement.offsetParent node.    For block-level elements, offsetTop, offsetLeft, offsetWidth, and offsetHeight describe the border box of an element relative to the offsetParent.    However, for inline-level elements (such as span) that can wrap from one line to the next, offsetTop and offsetLeft describe the positions of the first border box (use Element.getClientRects() to get its width and height), while offsetWidth and offsetHeight describe the dimensions of the bounding border box (use Element.getBoundingClientRect() to get its position). Therefore, a box with the left, top, width and height of offsetLeft, offsetTop, offsetWidth and offsetHeight will not be a bounding box for a span with wrapped text.
　　In compliance with the specification, this property will return null on Webkit if the element is hidden (the style.display of this element or any ancestor is "none") or if the style.positionof the element itself is set to "fixed".
　　This property will return null on Internet Explorer (9) if the style.position of the element itself is set to "fixed". (Having display:none does not affect this browser.)

语法：
var left = element.offsetLeft;

    The Element.clientHeight read-only property is zero for elements with no CSS or inline layout boxes, otherwise it‘s  the inner height of an element in pixels, including padding but not the horizontal scrollbar height, border, or margin.    clientHeight can be calculated as CSS height + CSS padding - height of horizontal scrollbar (if present).
语法：
var h = element.clientHeight;

    The Element.clientWidth property is zero for elements with no CSS or inline layout boxes, otherwise it‘s the inner width of an element in pixels. It includes padding but not the vertical scrollbar (if present, if rendered), border or margin.
语法：
var intElemClientWidth = element.clientWidth;

    The width of the top border of an element in pixels. It does not include the top margin or padding. clientTop is read-only.    Gecko-based applications support clientTop starting with Gecko 1.9 (Firefox 3, implemented in bug 111207). This property is not supported in Firefox 2 and earlier.
语法：
var top = element.clientTop;

    The width of the left border of an element in pixels. It includes the width of the vertical scrollbar if the text direction of the element is right–to–left and if there is an overflow causing a left vertical scrollbar to be rendered. clientLeft does not include the left margin or the left padding. clientLeft is read-only.    Gecko-based applications support clientLeft starting with Gecko 1.9 (Firefox 3, implemented in bug 111207). This property is not supported in Firefox 2 and earlier.    When layout.scrollbar.side preference is set to 1 or to 3 and when the text-direction is set to RTL, then the vertical scrollbar is positioned on the left and this impacts the way clientLeft is computed.
语法：
var left = element.clientLeft;

　　<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">　　<html>　　<head>　　　　<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />　　　　<title>Untitled Document</title>　　　　<script type="text/javascript" language="JavaScript">  　　　　function offset_init() {  　　　　var pElement = document.getElementById("sonObj");  　　　　　　parentObj = pElement.offsetParent;  　　　　　　alert(parentObj.tagName);    　　　}　　　　</script>　　　　</head>　　　　<body onload="offset_init()">　　　　　　<div id="parent">　　　　　　　　<p id="sonObj">测试OffsetParent属性</p>　　　　　　</div>　　　　</body>　　</html>

Firefox3："BODY"Internet Explorer 7："BODY"Opera 9.51："BODY"Chrome 0.2："BODY"Safari 3："BODY

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>　　<head>　　　　<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />　　　　<title>Untitled Document</title>　　　　<style type="text/css">　　　　　　#parent {    　　　　　　position: absolute; <!-- position：relative; -->    　　　　　　left: 25px;    　　　　　　top: 188px;    　　　　　　border: 1px solid black;　　　　　　}　　　　</style>　　　　<script type="text/javascript" language="JavaScript">    　　　　function offset_init() {　　　　　　　　var pElement = document.getElementById("sonObj");　　　　　　　　parentObj = pElement.offsetParent;　　　　　　　　alert(parentObj.tagName);    　　　　}　　　　</script>　　</head>　　<body onload="offset_init()">　　　　<div id="parent">div测试代码　　　　　　<p id="sonObj">测试OffsetParent属性</p>　　　　</div>　　</body></html>

Firefox3："DIV"Internet Explorer 7："DIV"Opera 9.51："DIV"Chrome 0.2："DIV"Safari 3："DIV"

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>　　<head>　　　　<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />　　　　<title>Untitled Document</title>　　　　<style type="text/css">　　　　　　#Grandfather {    　　　　　　position: relative;    　　　　　　left: 25px;    　　　　　　top: 188px;    　　　　　　border: 1px solid black;　　　　　　}　　　　</style>　　　　<script type="text/javascript" language="JavaScript">　　　　　　function offset_init() {　　　　　　　　var pElement = document.getElementById("sonObj");　　　　　　　　parentObj = pElement.offsetParent;　　　　　　　　alert(parentObj.tagName);    　　　　}　　　　</script>　　</head>　　<body onload="offset_init()">　　　　<h1 id="Grandfather">　　　　　　<div id="parent">　　　　　　　　<p id="sonObj">测试OffsetParent属性</p>　　　　　　</div>　　　　</h1>　　</body>
</html>

Firefox3："H1"Internet Explorer 7："H1"Opera 9.51："H1"Chrome 0.2："H1"Safari 3："H1"