6.JS盒子模型:3X4+1 =13 个属性
client系列:
clientHeight/clientWidth:内容的宽度/高度+左右/上下填充(padding)和内容溢出没有关系(不包括边框高度)
clinetTop:上边框的高度
clinetLeft:左边框的宽度
offset系列:
offsetWidth/offsetHeight:clientWidth/clientHeight+左右/上下边框
offsetParent:当前元素的父级参照物
offsetTop/offsetLeft:当前元素的外边框距离父级参照物的内边框距离的偏移量
scroll系列:
scrollWidth/scrollHeight:和clientWidth/clientHeight一样(前提是内容没有溢出)
如果内容有溢出(设置overflow=hidden后)
scrollWidth:真实内容的宽度(包含溢出)+左填充
scrollHeight:真实内容的高度(包含溢出)+上填充
scrollLeft/scrollTop:滚动条卷去的宽度/高度
浏览器盒子模型兼容写法
function win(attr,value){ if(typeof value ==='undefined' ){ return document.documentElement[attr]||document.body[attr]; } document.documentElement[attr]=value; document.body[attr] = value; }