名称 | 说明 |
---|---|
client | 确认按钮回调 |
![] (https://img2018.cnblogs.com/blog/1402448/201909/1402448-20190920170309578-2046550625.png)
<div id="outer"> <div id="inner"> <div id="center"></div> </div> </div>
clienttop/left/width/height
获取当前页面一屏幕(可视区域)的宽度和高度
document.documentelement.clientwidth || document.body.clientwidth document.documentelement.clientheight || document.body.clientheight
2.clienttop & clientleft:获取(上/左)边框的宽度
3.offsetwidth & offsetheight:在client的基础上加上border(和内容是否溢出也没有关系)
4.offsettop / offsetleft:获取当前盒子距离其父级参照物的偏移量(上偏移/左偏移) 当前盒子的外边框开始~父级参照物的内边框
center.offsetparent //=>body inner.offsetparent //=>body outer.offsetparent //=>body
获取当前页面的真实宽高(包含溢出的部分)
document.documentelement.scrollwidth || document.body.scrollwidth document.documentelement.scrollheight || document.body.scrollheight
7.scrolltop / scrollleft:滚动条卷去的宽度或者高度
最小卷去值:0
最大卷去值:真实页面的高度 - 一屏幕的高度 document.documentelement.scrollheight-document.documentelement.clientheight
在js盒子模型13个属性中,只有scrolltop/scrollleft是“可读写”属性,其余都是“只读”属性
操作浏览器的盒子模型属性,我们一般都要写两套,用来兼容各种模式下的浏览器
如对本文有疑问, 点击进行留言回复!!
JavaScript 好题汇总分享(持续更新,看到好题就写)
XMLHttpRequest 2级 &&进度事件&&JSONP
使用递归原生实现拷贝&&最简单的方法实现深拷贝
网友评论