javascript scrollLeft, scrollWidth, clientWidth, offsetWidth complete explanation_basic knowledge

scrollHeight: Gets the scroll height of the object.
scrollLeft: Sets or gets the distance between the left edge of the object and the leftmost end of the currently visible content in the window
scrollTop: Sets or gets the distance between the topmost edge of the object and the topmost end of the visible content in the window
scrollWidth: Get the scroll width of the object
offsetHeight: Get the height of the object relative to the layout or the parent coordinate specified by the offsetParent property
offsetLeft: Get the height of the object relative to the layout or the parent coordinate specified by the offsetParent property Calculate the left position
offsetTop: Get the calculated top position of the object relative to the layout or the parent coordinate specified by the offsetTop attribute
event.clientX The horizontal coordinate relative to the document
event.clientY The vertical coordinate relative to the document

event.offsetX The horizontal coordinate relative to the container
event.offsetY The vertical coordinate relative to the container
document.documentElement.scrollTop The value of vertical scrolling
event.clientX document.documentElement.scrollTop relative The amount of horizontal scrolling of the document in the vertical direction

The above mainly refers to IE. The differences in FireFox are 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 needs to be mentioned: the margin attribute in CSS has nothing to do with clientWidth, offsetWidth, clientHeight, and offsetHeight)

<title> Code example: Test comparison of clientWidth, offsetWidth, clientHeight, and offsetHeight </title> <meta http-equiv="content-type" content="text/html; charset=gb2312"> <meta name="author" content="">