Collection and sorting of attributes such as container size, positioning, and distance in js _ javascript skills

The container size, positioning, distance, and so on are widely used in practice. I would like to share with you the js-related code compiled in small series. If you have such a need, refer to it, I hope to help you with element. clientWidth // The actual width of the element, not the border

Element. clientHeight // The actual height of the element, not the border


Element. offsetWidth // The actual width of the element and the border

Element. offsetHeight // The actual height of the element and the border


Element. scrollWidth // This Is A Lot Of a saying. I tested it to be the actual width of the element-the width of the scroll bar.

Element. scrollHeight // There are many sayings about this. I tested the actual height of the element-the height of the scroll bar.


Element. offsetLeft // The distance from the parent object. In ie, if the position is set to relative, It is the distance from the window.

Element. offsetTop // The distance from the parent object. In ie, if the position is set to relative, It is the distance from the window.


Window. screenLeft // The distance from the current window to the screen is only for IE

Window. screenX // The distance between the current window and the screen is not for IE


Window. innerWidth // current window size (inner) not for IE

Window. outerWidth // current window size (outside) not for IE


Window. screen. width // current screen resolution

Window. screen. availWidth // available resolution of the current screen