javascript中的offsetWidth、clientWidth、innerWidth及相关属性方法

有关js中的offsetWidth、clientWidth、scrollWidth等一系列特性以及方式一直都傻傻的分不清楚，这儿就来汇总一下这种方式的使用方法和含意。

留意：下边原素特性和原素方式都根据elem.特性或elem.方式的方法应用，window特性根据window.特性的方法应用，document特性则根据document启用。

<script>
/*
******原素主视图特性
*offsetWidth水平方向width+上下padding+上下border-width
*offsetHeight竖直方位height+左右padding+左右border-width
*
*clientWidth水平方向width+上下padding
*clientHeight竖直方位height+左右padding
*
*offsetTop获得当今原素到精准定位父节点的top方位的间距
*offsetLeft获得当今原素到精准定位父节点的left方位的间距
*
*scrollWidth原素內容真正的总宽，內容不超过小盒子高宽比时为小盒子的clientWidth
*scrollHeight原素內容真正的高宽比，內容不超过小盒子高宽比时为小盒子的clientHeight
*
******原素主视图特性完毕
*
******Window主视图特性（低版IE电脑浏览器[*innerWidth电脑浏览器对话框可视区总宽（不包括电脑浏览器控制面板、工具栏、菜单栏）
*innerHeight电脑浏览器对话框可视区高宽比（不包括电脑浏览器控制面板、工具栏、菜单栏）
******Window主视图特性完毕
*
******Document文本文档主视图
*（低版IE的innerWidth、innerHeight的替代计划方案）
*document.documentElement.clientWidth电脑浏览器对话框可视区总宽（不包括电脑浏览器控制面板、工具栏、菜单栏、下拉列表）
*document.documentElement.clientHeight电脑浏览器对话框可视区高宽比（不包括电脑浏览器控制面板、工具栏、菜单栏、下拉列表）
*
*document.documentElement.offsetHeight获得全部文本文档的高宽比（包括body的margin）
*document.body.offsetHeight获得全部文本文档的高宽比（不包含body的margin）
*
*document.documentElement.scrollTop回到文本文档的翻转top方位的间距（当对话框产生翻转正值更改）
*document.documentElement.scrollLeft回到文本文档的翻转left方位的间距（当对话框产生翻转正值更改）
******Document文本文档主视图完毕
*
******原素方式
*1.getBoundingClientRect()获得原素到body
*bottom:原素底部（包含border）到可视区最顶端的间距
*left:原素最左侧（不包括border）到可视区最左侧的间距
*right:原素最右侧（包含border）到可视区最左侧的间距
*top:原素顶部（不包括border）到可视区最顶端的间距
*height:原素的offsetHeight
*width:原素的offsetWidth
*x:原素左上方的x座标
*y:原素左上方的y座标
*
*2.scrollIntoView()让原素翻转到可视区
*
******原素方式完毕
*
*/
</script>

上边特性中，有关window.innerWidth和window.innerHeight，自己检测的結果值是包括下拉列表的，但在网上的实例教程和有关文本文档都说不包括下拉列表，尽管下拉列表的总宽并不大，对总体危害都不显著，但如果有佛门**有精确回答的，还请鼎力相助，随手留个言，感谢！