网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWidth (包括边线的宽) 网页可见区域高:document.body.offsetHeight (包括边线的高) 网页正文全文宽:document.body.scrollWidth 网页正文全文高:document.body.scrollHeight 网页被卷去的高:document.body.scr…
常用: JS 获取浏览器窗口大小   // 获取窗口宽度 if (windows.innerWidth) winWidth = windows.innerWidth; else if ((document.body) && (document.body.clientWidth)) winWidth = document.body.clientWidth; // 获取窗口高度 if (windows.innerHeight) winHeight = windows.innerHeight;…
clientWidth.clientHeight.offsetWidth.offsetHeight以及scrollWidth.scrollHeight是几个困惑了好久的元素属性,趁着有时间整理一下 1. clientWidth 和 clientHeight 网页中的每个元素都具有 clientWidth 和 clientHeight 属性,表示可视区域的宽高,即元素内容加上padding以后的大小,而不包括border值和滚动条的大小, 如下图所示: 示例代码如下: HTML代码: <div i…
1.offsetLeft和offsetTop 只读属性,返回当前元素与父辈元素之间的距离(不包括边框).其中父辈元素的取法是有门道的: (1).若父辈元素中有定位的元素,那么就返回距离当前元素最近的定位元素的距离. (2).若父辈元素中没有定位元素,那么就返回相对于body的距离. (3).若当前元素具有固定定位(position:fixed;),那么返回的是当前元素与可视窗口的距离. <div id="a" style="width:400px;height:400p…
document.body.clientWidth 获取body元素对象的内容可视区域的宽度,即clientWidth=width+padding,不包括滚动条. document.body.clientHeight 获取body元素对象的内容可视区域的高度,即clientHeight=height+padding,不包括滚动条. 浏览器兼容性 在IE7中,如果给body设置滚动条的话,滚动条是出现在body内部的.所以当给body设置width和height时,在IE7中clientWidth…
scrollWidth:对象的实际内容的宽度,不包边线宽度,会随对象中内容超过可视区后而变大. clientWidth:对象内容的可视区的宽度,不包滚动条等边线,会随对象显示大小的变化而改变. offsetWidth:对象整体的实际宽度,包滚动条等边线,会随对象显示大小的变化而改变. innerWidth: window.innerHeight=浏览器窗口的内部高度 window.innerWidth=浏览器窗口的内部宽度 例子 textarea 1.元素内无内容或者内容不超过可视区,滚动不出现…
1.元素视图属性 clientWidth:元素内容可视区宽度(水平方向 width + 左右 padding). clientHeight:元素内容可视高度(垂直方向 height + 上下padding). offsetWidth:元素实际宽度(水平方向 width + 左右 padding + 左右 border-width). offsetHeight:元素实际高度(垂直方向 height + 上下 padding + 上下 border-width). scrollWidth:元素内容实…
<div id="drag" class="drag">drag me</div> <script type="text/javascript"> window.onload = function(e) { e = e || window.event; var drag = O('drag'); console.log(drag.offsetWidth); } function O(id) { return d…
一.clientX和clientY 事件发生时,鼠标距离浏览器的可视区域的X.Y轴的位置,不包含滚动条的区域的部分.就算是页面进行了滚动,鼠标的坐标值还是参考可视区域的. 二.offsetLeft和offsetTop 事件源元素相对于父节点的偏移的像素值. 三.offsetWidth和offsetHeight 获取的是元素的宽度,包含border,padding,内容宽度,以及滚动条的宽度,和element.getBoundingClientRect()的值是一致的. 四.clientWidth…
w3c规范,请戳这里:http://www.w3.org/TR/cssom-view/#dom-htmlelement-offsetparent 一.offsetParent 英文解读: part one:offsetParent作为一个元素属性并不是每一个元素都是值得拥有的,对于符合以下情况的元素是没有offsetParent这个属性的: ① 该元素没有css布局的盒子模型(我觉得这句话很难理解,有见识的人指教): ② 该元素是根元素(关于这一点的理解在后续会解释,其实原因就是offsetPa…