clientWidth
clientHeight
- These two attributes can get the visible width and height of the element
- These attributes are all without px, and the return is a number, which can be directly calculated
- Will get the width and height of the element, including the content area and padding
- These attributes are read-only and cannot be modified
offsetWidth
offsetHeight
- Get the entire width and height of the element, including the content area, padding and border
offsetParent
- Can be used to get the positioning parent element of the current element
- Will get the nearest ancestor element with positioning enabled
- If all of the ancestor elements are not open for positioning, return body
offsetLeft
- The horizontal offset of the current element relative to its positioned parent element
offsetTop
- The vertical offset of the current element relative to its positioned parent element
scrollWidth
scrollHeight
- You can get the width and height of the entire scrolling area of the element
scrollLeft
- You can get the distance
scrollTop of the horizontal scroll bar - You can get the distance of the vertical scroll bar
When scrollHeight-scrollTop == clientHeight is satisfied, the
vertical scroll bar is scrolled to the end
When scrollWidth-scrollTop == clientWidth is satisfied, the
horizontal scroll bar is scrolled to the end