Copy the codeThe code is as follows:
//Get coordinate position
function getpos(e) {
var t=;
var l=;
var height=;
while(e=) {
t+=;
l+=;
}
}
Assume obj is an HTML control.
Refers to the position, integer, unit pixel from obj to the upper or upper control.
Refers to the position of obj from the left or upper control, integer, unit pixel.
Refers to the width, integer, and unit pixels of the obj control itself.
Refers to the height, integer, unit pixel of the obj control itself.
We explain the aforementioned "upper or upper" and "left or upper" controls.
For example:
Copy the codeThe code is as follows:
<div >
<input type="button" value="submit">
<input type="button" value="reset">
</div>
The offsetTop of the "Submit" button refers to the distance between the "Submit" button and the upper border of the "tool" layer, because the closest to it is the upper border of the "tool" layer.
The offsetTop of the "Reset" button refers to the distance between the "Reset" button from the upper border of the "tool" layer, because the closest to it is the upper border of the "tool" layer.
The offsetLeft of the Submit button refers to the distance from the Submit button to the left border of the "tool" layer, because the closest to its left is the left border of the "tool" layer.
The offsetLeft of the Reset button refers to the distance from the Reset button to the right border of the Submit button, because the closest to its left is the right border of the Submit button.
offsetTop can obtain the position of the HTML element above or outer element, which is also possible. The difference between the two is:
1. offsetTop returns a number, while returns a string, which also contains the unit: px in addition to the number.
2. OffsetTop is read-only and can be read-write.
3. If the top style is not specified for the HTML element, the returned empty string.
The same is true for offsetLeft and , offsetWidth and , offsetHeight and .
scrollHeight: Gets the scroll height of the object.
scrollLeft: Set or get the distance between the left boundary of the object and the leftmost end of the currently visible content in the window
scrollTop: Set or get the distance between the top of the object and the top of the visible content in the window
scrollWidth: Get the scroll width of the object
offsetHeight: Gets the height of the object relative to the layout or the parent coordinate specified by the parent coordinate offsetParent property
offsetLeft: Gets the calculated left position of the object relative to the layout or parent coordinates specified by the offsetParent property
offsetTop: Gets the calculated top position of the object relative to the layout or the parent coordinate specified by the offsetTop property
Horizontal coordinates relative to the document
Vertical coordinates relative to the document
Horizontal coordinates relative to the container
Vertical coordinates relative to container
The value of scrolling vertically
+ Horizontal coordinates relative to the document + the amount of scrolling in the vertical direction
The above mainly refers to IE, and the differences in FireFox are as follows:
Copy the codeThe code is as follows:
IE6.0、FF1.06+：
clientWidth = width + padding
clientHeight = height + padding
offsetWidth = width + padding + border
offsetHeight = height + padding + border
IE5.0/5.5：
clientWidth = width - border
clientHeight = height - border
offsetWidth = width
offsetHeight = height
(It should be mentioned that the margin attribute in CSS has nothing to do with clientWidth, offsetWidth, clientHeight, and offsetHeight)