1.浏览器可视窗口的概述：前端
浏览器可视区域不是网页的body的大小。可视区指的是浏览器减去上面菜单栏、工具栏，下面状态栏和任务栏，右边滚动条（若是有的话）后的中间网页内容的单页面积大小。而body大小是随着内容调整而变更的，可大可小。若是有滚动条的话，body的要大于可视区浏览器
2.不一样浏览器或版本的不一样写法： 工具
对于IE9+、Chrome、Firefox、Opera 以及 Safari(window对象属性不支持IE8及如下浏览器):
window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度
对于 Internet Explorer 八、七、六、5：
document.documentElement.clientHeight 表示HTML文档所在窗口的当前高度（浏览器窗口的内部高度）
document.documentElement.clientWidth 表示HTML文档所在窗口的当前宽度（浏览器窗口的内部宽度）
或者 Document对象的body属性对应HTML文档的<body>标签
document.body.clientHeight （body标签的内部高度）
document.body.clientWidth （body标签的内部宽度）spa
综上所述，在不一样浏览器都实用的兼容性JavaScript 方案以下：
var w= window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
var h= window.innerHeight || document.documentElement.clientHeight|| document.body.clientHeight;对象
3. 关于兼容性的后二者的理解：ip
3.1 二者对象不一样（前者是浏览器对象，后者是body对象），其结果也不绝对相同
文档
3.2 在浏览器默认的状况下，body有8-10px左右的边距，而可见区域包括了这个边距，所以若是咱们用到body{padding:0;margin:0;}来消除这种默认的状况。那么document.body.clientWidth和document.documentElement.clientWidth 的值就会相同。class
获取更多前端知识，请关注下方二维码 ↓↓↓↓↓↓兼容性
