1、clientWidth clientHeight
The width and height of the visible portion of the element (i.e. the CSS width plus padding). They do not put a border and scroll bars are included, nor any possibility of scrolling.
If the CSS is not the height and width of the specified element (i.e. adaptive), 0 is displayed in IE, IE browser rather than the actual value is displayed
2、
offsetWidth offsetHeight
Elements occupy in the page width and height of the total. The difference between them and the previous attribute is that they put a border element and scroll bars included.
If the CSS is not the height and width of the specified element (i.e. adaptive), all browsers will display the actual values width + padding + border
3、
scrollWidth scrollHeight
Given set overflow: visible elements of the overall width and height. If the width and height greater than clientWidth and clientHeight, the element will need to scroll.
width + padding + border
When the value of hidden / scroll, all browsers will return to display all the elements: overflow
overflow: visible when, google chrome, Safari, IE will be displayed when displaying the value of all elements, and FF, Opera displays the value of the area to be displayed
The property has a lot of Bug, so in the specific application, use very little.
4,
scrollTop and scrollLeft
scrollTop and properties given distance scrollLeft (pixel values) has rolling elements. When you set these properties when the page scrolls to the new coordinates.
5, FIG.
Reproduced in: https: //www.cnblogs.com/rainman/archive/2009/02/15/1391165.html