js或者jquery如何获取自适应宽度的具体值

js或者jquery如何获取自适应宽度的具体值,第1张

网页可见区域宽: documentbodyclientWidth

网页可见区域高: documentbodyclientHeight

网页可见区域宽: documentbodyoffsetWidth (包括边线的宽)

网页可见区域高: documentbodyoffsetHeight (包括边线的高)

网页正文全文宽: documentbodyscrollWidth

网页正文全文高: documentbodyscrollHeight

网页被卷去的高: documentbodyscrollTop

网页被卷去的左: documentbodyscrollLeft

网页正文部分上: windowscreenTop

网页正文部分左: windowscreenLeft

屏幕分辨率的高: windowscreenheight

屏幕分辨率的宽: windowscreenwidth

屏幕可用工作区高度: windowscreenavailHeight

屏幕可用工作区宽度: windowscreenavailWidth

你可以用documentbodyscrollWidth

来获取,但兼容性本人没有做过测试。 给你个参考:网页可见区域宽:documentbodyclientWidth

网页可见区域高:documentbodyclientHeight

网页可见区域宽:documentbodyoffsetWidth(包括边线的宽)

网页可见区域高:documentbodyoffsetHeight(包括边线的宽)

网页正文全文宽:documentbodyscrollWidth

网页正文全文高:documentbodyscrollHeight

网页被卷去的高:documentbodyscrollTop(IE7无效)

网页被卷去的左:documentbodyscrollLeft(IE7无效)网页被卷去的高:documentdocumentElementscrollTop(IE7有效)网页被卷去的左:documentdocumentElementscrollLeft(IE7有效)

网页正文部分上:windowscreenTop

网页正文部分左:windowscreenLeft

屏幕分辨率的高:windowscreenheight

屏幕分辨率的宽:windowscreenwidth

屏幕可用工作区高度:windowscreenavailHeight

屏幕可用工作区宽度:windowscreenavailWidth

相对于窗口左上角的X:windoweventclientX相对于窗口左上角的Y:windoweventclientY

相对于整个页面的X:windoweventX

相对于整个页面的Y:windoweventY

<script type="text/javascript"> <!--

var winWidth = 0;

var winHeight = 0;

function findDimensions() //函数:获取尺寸

{

//获取窗口宽度

if (windowinnerWidth)

winWidth = windowinnerWidth;

else if ((documentbody) && (documentbodyclientWidth))

winWidth = documentbodyclientWidth;

//获取窗口高度

if (windowinnerHeight)

winHeight = windowinnerHeight;

else if ((documentbody) && (documentbodyclientHeight))

winHeight = documentbodyclientHeight;

//通过深入Document内部对body进行检测,获取窗口大小

if (documentdocumentElement && documentdocumentElementclientHeight &&

documentdocumentElementclientWidth)

{

winHeight = documentdocumentElementclientHeight;

winWidth = documentdocumentElementclientWidth;

}

//结果输出至两个文本框

documentform1availHeightvalue= winHeight;

documentform1availWidthvalue= winWidth;

}

findDimensions(); //调用函数,获取数值

windowonresize=findDimensions;

//-->

</script>

javascript获取元素的高度:

var obj = documentgetElementById("test");

alert(objheight + "\n" + objwidth);

// 200px 200px typeof=string只是将style属性中的值显示出来

扩展:

获取元素的实际大小

clientWidth和clientHeight

这组属性可以获取元素可视区的大小,可以得到元素内容及内边距所占据的空间大小。返回了元素大小,但没有单位,默认单位是px,如果你强行设置了单位,比如100em之类,它还是会返回px的大小。(CSS获取的话,是照着你设置的样式获取)。对于元素的实际大小,clientWidth和clientHeight理解方式如下:

a 增加边框,无变化;

b 增加外边距,无变化;

c 增加滚动条,最终值等于原本大小减去滚动条的大小;

d 增加内边距,最终值等于原本大小加上内边距的大小;

var screen = windowscreen;//获取分辨率

screenwidth;//获取分辨率的宽度

screenheight;//获取分辨率的高度

//页面缩放比例设置方法

documentgetElementsByTagName('body')[0]stylezoom=067 //该方法将页面设置比例调整为67%

精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth

scrollHeight: 获取对象的滚动高度。

scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离

scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离

scrollWidth:获取对象的滚动宽度

offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度

offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置

offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置

eventclientX 相对文档的水平座标

eventclientY 相对文档的垂直座标

eventoffsetX 相对容器的水平坐标

eventoffsetY 相对容器的垂直坐标

documentdocumentElementscrollTop 垂直方向滚动的值

eventclientX+documentdocumentElementscrollTop 相对文档的水平座标+垂直方向滚动的量

实现代码

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 10 Transitional//EN"

">

//js部分

$(document)ready(function() {

$("#button")click(function() {

alert("高:"+$(document)height()+" 宽:"+$(document)width());

});

});<!-- html 部分 -->

<button id="button">点击显示</button>

你真确定不好使?检查一下jquery路径吧。

以上就是关于js或者jquery如何获取自适应宽度的具体值全部的内容,包括:js或者jquery如何获取自适应宽度的具体值、JS获取页面内容宽度各浏览器不一、js如何获得页面的大小等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址:https://www.54852.com/web/9736885.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-01
下一篇2023-05-01

发表评论

登录后才能评论

评论列表(0条)

    保存