宝哥软件园

详细说明IE和FF下用javascript获取网页和窗口大小的区别

编辑:宝哥软件园 来源:互联网 时间:2021-11-11

在新定义的标准下,document . document element . client height可以在IE和Firefox中获得正确的值。以下文章详细介绍了获取各种浏览器可见窗口大小的区别:脚本语言=' JavaScript '函数getinfo(){ var s=' ';S='网页可见区域的宽度:' document . body . client width;S='网页可见区域的高度:' document . body . client height;S='网页可见区域的宽度:' document . body . offset with '(包括边缘和滚动条的宽度)';S='网页可见区域的高度:' document . body . offset theight '(包括边缘的宽度)';S='网页正文的全文宽度:' document . body . scrollwidth;S='网页正文的全文高度:' document . body . scroll height;S='网页滚动的高度(ff):' document . body . scroll top;S='网页被卷起的高度(即):' document . document element . scroll top;S='网页滚离的左边:' document . body . scroll left;S='在网页正文上:' window.screenTopS='网页主体左侧:' window.screenLeftS='屏幕分辨率的高度:' window . screen . height;S='屏幕分辨率的宽度:' window . screen . width;S='屏幕的可用工作空间高度:' window . screen . available height;S='屏幕的可用工作空间宽度:' window . screen . available width;S='您的屏幕设置为' window . screen . color depth ' bit color ';S=“您的屏幕设置”window.screen.deviceXDPI“像素/英寸”;警报;} getInfo();/script可以在IE、FireFox、Opera下使用document . body . client widt document . body . client height获取,非常简单方便。在企业项目中:Opera仍然使用document . body . client widt document . body . client height,但是IE和FireFox使用document . document element . client widt document . document element . client height!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www . w3 . org/TR/XHTML 1/DTD/XHTML 1-transition . DTD '如果将这一行标记添加到页面中,在IE中:document . body . client width==body对象宽度document . body . client height==body对象高度document . document element . client wi . Dth==可视区域宽度document . document element . client height==FireFox中的可视区域高度:document body client width。nt . document element . client width==可见区域宽度document . document element . client height==Opera中的可见区域高度:document.body.clientWidth==可见区域宽度width document.body.clientH Eight==可见区域高度document . document element . client width==页面对象宽度(body对象宽度加上边距宽度)document . document element . client height==页面对象高度(body对象高度加上边距高度)。假设obj是一个HTML控件。Obj.offsetTop指的是Obj相对于上控件或上控件的位置,整数,单位像素。Obj.offsetLeft指的是Obj从左边或上方控制的位置,整数,单位像素。Obj.offsetWidth指的是Obj控件本身的宽度、整数和单位像素。Obj.offsetHeight指的是Obj控件本身的高度,整数,单位像素。让我们解释一下上面提到的“上或上”和“左或上”控件。示例:div id=' tool '输入类型='button '值=' submit '输入类型=' button '值=' reset '/div submit按钮的offsetTop指的是submit按钮与“tool”图层上边框之间的距离,因为“tool”图层的上边框离它最近。“重置”按钮的偏移指的是“重置”按钮和工具层上边框之间的距离,因为工具层的上边框离它最近。“提交”按钮的偏移指的是“提交”按钮与工具层左边框之间的距离,因为最靠近其左侧的是工具层的左边框。重置按钮的偏移量是指重置按钮与提交按钮右边框之间的距离,因为最靠近其左侧的是提交按钮的右边框。

OffsetTop可以从上部或外部元素获取HTML元素的位置,style.top也可以,两者的区别如下:1。offsetTop返回数字,而style.top返回字符串,除数字外还有单位px。第二,offsetTop是只读的,而style.top可以读写。第三,如果没有为HTML元素指定顶部样式,那么style.top将返回一个空字符串。偏置左边和样式。左边,偏置右边和样式。宽度,偏置右边和样式。高度相同。

ScrollHeight:获取对象的滚动高度。ScrollLeft:设置或获取对象左边缘与窗口中当前可见内容最左端之间的距离scrollTop:设置或获取对象最顶端与窗口中可见内容最顶端之间的距离scrollWidth:获取对象的滚动宽度offsetHeight:获取对象相对于布局或的父坐标。由偏移父属性偏移指定的父坐标的高度:获取对象相对于布局的左计算位置或由偏移父属性偏移指定的父坐标:获取对象相对于布局的上计算位置或由偏移属性事件指定的父坐标。Event.clientX document .带有水平坐标事件的文档. clientY相对于文档事件的垂直坐标. offsetX相对于水平坐标事件. offset相对于垂直坐标文档. documentelement .容器的顶部。Element.scrollTop相对于文档水平坐标的垂直滚动量主要是指IE。火狐有以下区别:IE6.0,FF1.06 : clientWidth=宽度填充clientHeight=高度填充offsetWidth=宽度填充边框offsetHeight=高度填充边框IE 5.0/5.5: clientWidth=宽度-border cientheight=高度-border offset with=宽度offsetHeight=高度(需要说明的是,CSS中的margin属性与clientWidth、offset with、clientHeight和offsetHeight无关)。

更多资讯
游戏推荐
更多+