600字范文,内容丰富有趣,生活中的好帮手!
600字范文 > js获取页面高度获取视口高度获取内容高度获取滚动条宽度高度

js获取页面高度获取视口高度获取内容高度获取滚动条宽度高度

时间:2022-02-22 02:05:40

相关推荐

js获取页面高度获取视口高度获取内容高度获取滚动条宽度高度

element对象的宽高属性

1. DOM树2.document对象3.element对象4. 获取元素高度宽度

1. DOM树

浏览器根据DOM模型,将结构化文档HTML解析成节点,DOM的最小组成单位就是节点,这些节点是树形结构。

DOM:文档对象模型,是js操作网页的接口。DOM可以用多种语言操作,js是最常见的操作DOM的语言。

节点:是构成网页的最基本的组成部分,网页中有很多节点。html 元素、属性、文本、注释、整个文档等都是节点。

DOM树形结构如图所示:

2.document对象

document对象是文档的根节点,当网页载入时,这个节点就有了。可以访问页面中所有元素。如:

1. document.body---body 2. document.documentElement---html

3.element对象

element代表元素节点,代表页面中的一个个标签,也是DOM树的叶子。

4. 获取元素高度宽度

// clientHeight--包含padding// 获取视口高度---document.documentElement---即html整个网页document.documentElement.clientHeight;// 获取视口宽度--包含paddingdocument.documentElement.clientWidth;// 获取页面内容高度---因为body由内容撑开document.body.clientHeight// 获取垂直滚动条向下滚动的距离document.documentElement.scrollTop;// 获取水平滚动条向右滚动的距离document.documentElement.scrollLeft;

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。