
alert(objstylewidth);改成 alert(documentdefaultViewgetComputedStyle(obj,null)['width']);
objstylewidth只能获得用style=‘’标签显示设置的样式,不能获得在样式文件中定义的样式,在火狐、谷歌等浏览器中用documentdefaultViewgetComputedStyle(obj,null)['width']能够获取到样式表中定义的样式,在ie下用的是objcurrentStyle['width']
如果元素是body内的一级元素,可以用offsetLeft直接获得其左边距。
如果元素是嵌套的,且父元素中存在容器元素(即具有定位属性的元素,包括绝对定位、相对定位、固定定位),则情况要变复杂了,需要把所有容器的offsetLeft和元素的offsetLeft相加才是最终的左边距:
var obj=documentgetElementById("test"); //假定元素的id为testvar left=objoffsetLeft;
while(obj=objoffsetParent){
left+=objoffsetLeft;
}
consolelog(left); //left就是左边距
javascript获取div的class中设置的宽高度:
高度(offsetHeight):
<head><title>用js获取div的高度</title></head><style type="text/css">
#box{border:1px solid #ff0000;width:200px; }
</style>
<script language="javascript">
function jj(){
var pp=documentgetElementById("box")offsetHeight;
alert(pp);
}
</script>
<body>
<div id="box">
<p>段落内容</p><p>段落内容</p>
<input type="button" onclick="jj();" value="click">
</div>
</body>
宽度(offsetWidth):
<head><title>用js获取div的高度</title></head><style type="text/css">
#box{border:1px solid #ff0000;width:200px; }
</style>
<script language="javascript">
function jj(){
var pp=documentgetElementById("box")offsetWidth;
alert(pp);
}
</script>
<body>
<div id="box">
<p>段落内容</p><p>段落内容</p>
<input type="button" onclick="jj();" value="click">
</div>
</body>
精确定位: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获取宽度问width获取空白,已经定义过的全部的内容,包括:js获取宽度问width获取空白,已经定义过的、js 可以用offsetWidth 获取控件宽度 , 能获取左边框与body的距离吗、javascript如何获取div的class中设置的宽高度等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)