一.offset系列属性 <div id="dv"></div> <!-- 已在style标签里设置div宽高各100px --> <script> //在style标签里面的样式属性无法获取,但是在style属性中设置的样式可以获取 console.log(document.getElementById("dv").style.width);//为空---无法获取 //所以引出了offset系列,总共有四个属性如下:…

  三大系列:offset.scroll.client 事件对象:event(事件被触动时,鼠标和键盘的状态)(通过属性控制)   三大系列都是以DOM元素节点的属性形式存在的. 类比访问关系,也是以属性形式存在. 不同点在于,访问关系是为了获取其他节点,而三大系列是为了获取元素节点更多的信息.           1. offset 系列 offset:偏移.补偿.位移 offset 系列是 js 中的一套获取元素尺寸的便捷办法.   (1) offsetWidth 和 offsetHeigh…

offsetHeight: 元素高,height+border+paddingoffsetWidth: 元素宽,width+border+paddingoffsetTop: 距离offsetParent顶部的距离offsetLeft: 距离offsetParent左边的距离offsetParent: 最近的带有定位的父盒子 scrollHeight: 内容高,不含borderscrollWidth: 内容宽,不含border scrollTop: 被滚动条卷走的部分document.docume…

1.offsetHeight / Width (只读) offsetHeight:表示该元素在垂直方向占用的空间大小,包含元素的高度+上边框高度+下边框高度 offsetWidth:表示该元素在水平方向占用的空间大小,包含元素的高度+上边框高度+下边框高度 2.clientHeight / clientWidth (只读) clientHeight:元素内容区的高度+元素内边距的高度 clientWidth:元素内容区的宽度+元素内边距的宽度 clientWidth = width + padd…

1.client 1.1主要成员 1.clientWidth 获取网页可视区域宽度(两种用法)    clientHeight 获取网页可视区域高度 (两张用法) 盒子调用: 指盒子本省 浏览器调用:可视区域大小. 2.clientX  鼠标距离可视区域左侧的距离(event调用) clientY 鼠标距离可视区域上侧的距离(event 调用) 2.三大家族的区别 2.1Width 和 Height clientWidth = width +padding clientheight = heig…

一.计时器 setInterval ( 函数/名称 , 毫秒数 )表示每经过一定的毫秒后,执行一次相应的函数(重复) setTimeout ( 函数/名称 , 毫秒数 ) 表示经过一定的毫秒后,只执行一次相应的函数(不重复) 清除计时器: clearInterval( ); clearTimeout( ); 当计时器调用执行完毕时,它将返回一个timer ID, 如果将该ID传递给clearInterval,便可以终止代码的执行. 实例: 页面布局: <div id="wrap"…

HTML元素有几个offset.client.scroll开头的属性,总是让人摸不着头脑.在书中看到记下来,分享给需要的小伙伴.主要是以下几个属性: 第一组:offsetWidth,offsetHeight,offsetLeft,offsetTop,offsetParent  第二组:clientWidth,clientHeight,clientLeft,clientTop 第三组:scrollWidth,scrollHeight,scrollLeft,scrollTop 详细定义如下: 1.1…

原文:javascript中常用坐标属性offset.scroll.client 今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. 1.在文档(document)对象里面用: scrollWidth/Height:获取对象的滚动宽度(滚动条可以滚动的宽度,相当于整个页面的总宽度的样子--网页正文全宽) scrollLeft/Top:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离(页面利用滚动条滚动到右边时,隐藏在…

DOM盒模型和位置 client offset scroll 和滚动的关系 概览 在dom里面有几个描述盒子位置信息的值, pading border margin width height client clientWidth 不要border clientHeight 不要border offset offsetTop offsetLeft offsetWidth  要border offsetHeight  要border scroll scrollTop scrollHeight scr…

offsetParent:返回该元素有定位的父级,如果父级都没有定位则返回body offsetTop:返回元素相对父级(带有定位的父级)上方的偏移 offsetLeft:返回元素相对父级(带有定位的父级)左边框的偏移 offsetWidth:返回自身的宽度,包括padding.border.内容区,返回数值不带单位 offsetHeight:返回自身的高度,包括padding.border.内容区,返回数值不带单位 style.width 只能获取行内样式的数据,返回有单位,能用js修改数值…