Native js obtains browser window and element width and height common method collection
- 2021-07-12 04:59:53
- OfStack
Window visible area width: document. documentElement. clientWidth document. body. clientWidth;
Height of window visible area: document. documentElement. clientHeight document. body. clientHeight;;
Window visible area width + edges and scroll bars: document. body. offsetWidth;
Window visible area height + edges and scroll bars: document. body. offsetHeight;
Width of actual content: document. body. scrollWidth;
Height of actual content: document. body. scrollHeight;
The distance the scroll bar pulls down is rolled up: document. documentElement. scrollTop window. pageYOffset document. body. scrollTop;
Scroll bar side pull is rolled up distance: document. body. scrollLeft document. documentElement. scrollLeft;
On the body of the webpage: window. screenTop;;
Left of the main body of the webpage: window. screenLeft;;
Width of element: obj. offsetWidth;
Height of element: obj. offsetHeight;
Upward displacement relative to parent element: obj. offsetTop; (If the containing element of the element does not contain a scroll bar)
Left displacement relative to parent element: obj. offsetLeft; (If the containing element of the element does not contain a scroll bar)