动态获取屏幕（浏览器窗口）宽度 高度、滚动捕捉onscroll

             //原生js
               window.onresize = function() {
                   console.log(document.body.clientWidth); 
                  } 

                // jq方式       
               $(window).resize(function(){
                 console.log($(document.body).width()); 
               })    

Javascript:

网页可见区域宽：document.body.clientWidth

网页可见区域高：document.body.clientHeight

console.log('获取 页面 默认高度',document.documentElement.clientHeight) 

当然还可以用 window.innerHeight 区别在于 是否计算滚动条 因为innerHeight属于window的 所以当窗口出现滚动条 这个高度会比document获取的要长

网页可见区域宽：document.body.offsetWidth (包括边线的宽)

网页可见区域高：document.body.offsetHeight (包括边线的高)

网页正文全文宽：document.body.scrollWidth

网页正文全文高： document.body.scrollHeight

网页被卷去的高：document.body.scrollTop

网页被卷去的左：document.body.scrollLeft

网页正文部分上：window.screenTop

网页正文部分左：window.screenLeft

屏幕分辨率的高：window.screen.height

屏幕分辨率的宽：window.screen.width

屏幕可用工作区高度：window.screen.availHeight

屏幕可用工作区宽度： window.screen.availWidth

JQuery:

$(document).ready(function(){

alert($(window).height()); //浏览器当前窗口可视区域高度

alert($(document).height()); //浏览器当前窗口文档的高度

alert($(document.body).height());//浏览器当前窗口文档body的高度

alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度包括border padding margin

alert($(window).width()); //浏览器当前窗口可视区域宽度

alert($(document).width());//浏览器当前窗口文档对象宽度

alert($(document.body).width());//浏览器当前窗口文档body的宽度

alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度包括border padding margin

})

window.innerHeight属于BOM（浏览器对象模型），
而document.documentElement.clientHeight则属于文档对象模型

window.innerHeight获取的高度包含横向滚动条，
而document.documentElement.clientHeight不包含横向滚动条