大家好，又见面了，我是你们的朋友全栈君。
clientWidth 在任何窗口系统中都是指用户内容能放置的空间
clientWidth 是每个 document 一个，一个窗口中可以放置多个 document，比如你用 frame 或 iframe 就可以放置多个 document，这相当于图形界面编程中的 MDI （多文档窗口应用，比如 Word, Excel 就可以同时打开多个文档）。
window.innerWidth能获取当前窗口的宽度(包含滚动条)，当浏览器宽度调整时，这个值也会跟着变化。
window.innerWidth在IE8浏览器是无效的。代替品–>$(window).width()
$(window).width()获取当前窗口的宽度(不包含滚动条).需要引用jquery.js文件，它是jquery方法。
浏览器和屏幕各种高度宽度
Javascript:
屏幕可视区域的宽高，不包括滚动条与工具条，跟jquery的(window).width()与(window).height()获得的结果是一样的。
document.documentElement.clientWidth
document.documentElement.clientHeight
document.body.clientWidth //网页可视区域的宽度(body)
document.body.clientHeight //网页body内容的高度(body）
body的height:100%影响document.body.clientHeight的值
offsetWidth & offsetHeight 本身的宽高 + padding + border + 滚动条
document.body.offsetWidth //网页可见区域宽(body)，包括border、margin等
document.body.offsetHeight //网页可见区域宽(body)，包括border、margin等
document.body.scrollWidth //网页正文全文宽，包括有滚动条时的未见区域
document.body.scrollHeight //网页正文全文高，包括有滚动条时的未见区域
document.body.scrollTop //网页被卷去的Top(滚动条)
document.body.scrollLeft //网页被卷去的Left(滚动条)
window.screenTop //浏览器距离Top
window.screenLeft //浏览器距离Left
window.screen.height //屏幕分辨率的高
window.screen.width //屏幕分辨率的宽
window.screen.availHeight //屏幕可用工作区的高
window.screen.availWidth //屏幕可用工作区的宽
可视区域的宽，但是包含纵向滚动条的宽度（E8以及以下不支持）
window.innerWidth=width + padding + border + 纵向滚动条宽度
window.innerHeight = height + padding + border + 横向滚动条高度可视区域的宽，包含工具条与滚动条窗口的宽度与高度（E8以及以下不支持）
window.outerWidth=width + padding + border + 纵向滚动条宽度
window.outerHeight = height + padding + border + 横向滚动条高度 + 工具条高度
$(Window).scrollTop() //文档显示区 滚动的高度
(Window).scroll(function(){……}） //窗口滚动时执行
$().offset() 当前元素距离body 的{top:xxx，left:xxx}
Jquery:
屏幕可视区域的宽高，不包括滚动条与工具条
$(window).width() //浏览器当前窗口可视区域宽度
$(window).height() //浏览器当前窗口可视区域高度
$(document).height() //浏览器当前窗口文档的高度
$(document.body).height(） //浏览器当前窗口文档body的高度
$(document.body).outerHeight(true) //浏览器当前窗口文档body的总高度 包括border padding margin
$(document).width() //浏览器当前窗口文档对象宽度
$(document.body).width() //浏览器当前窗口文档body的宽度
$(document.body).outerWidth(true) //浏览器当前窗口文档body的总宽度 包括border padding margin
offsetLeft & offsetTop
返回元素的X和Y坐标，相对于已定位元素/相对于文档
scrollWidth & scrollHeight
元素的内容区域+内边距+溢出内容的尺寸.
因此，如果没有溢出时，这些属性与clientWidth和clientHeight是相等的。
scrollLeft & scrollTop
元素的滚动条的位置
scrollLeft和scrollTop都是可写的属性，通过设置它们来让元素中的内容滚动。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/163038.html原文链接：https://javaforall.net
![angular子组件传值给父组件[通俗易懂]](https://javaforall.net/wp-content/uploads/2020/11/2020110817443450-480x300.jpg)
