高程3 P.198
书上说了innerWidth和innerHeight的值即视口(viewport)大小。
接着又说了document.documentElement.clientWidth和document.documentElement.clientHeight也可以取得视口大小。
那么viewport到底是哪一个值呢?包不包含滚动条的宽度呢?
还有书中这样的代码,显然是把window.innerWidth和document.documentElement.clientWidth当成相同的值处理了
//取得页面视口的大小 var pageWidth = window.innerWidth; var pageHeight = window.innerHeight; if(typeof pageWidth != "number"){ if(document.compatMode == "CSS1Compat") pageWidth = document.documentElement.clientWidth; pageHeight = document.documentElement.clientHeight; }else{ pageWidth = document.body.clientWidth; pageHeight = document.body.clientHeight; } }
打开控制台发现
window.innerHeight和document.documentElement.clientHeight值相等,都不包括滚动条。
//可能理解错了你的意思,如果说是滚动条本身的宽度的话
console.log(window.innerWidth)
VM160:1 1366
console.log(document.documentElement.clientWidth)
VM168:1 1349
innerWidth是有滚动条宽度的
//
刚才去看了书上的代码
这段代码是适用于混杂模式下的浏览器的,标准模式都保存在innerWidth和innerHeight中
//
视口的宽高是包含滚动条的
innerWidth