offsetHeight在OnLoad中获取为0的现象

需要获取div的高度时,往往需要用到offsetHeight,有时会碰到offsetHeight获取到为0的现象,感兴趣的朋友可以参考下面的代码片段
 

在使用IE中,特别在目前div+css的方式,往往不定义div的高度,这是在添加div内容后,需要获取div的高度时,往往需要用到offsetHeight。

在使用中,有时会碰到offsetHeight获取到为0的现象,但如果你用各种JS调试工具调试,又能在对象中看到值(如果直接指向offsetHeight是没值的,但如果是对象查看是有值的,在调试器中回车查看对象就已经刷新对象了,所以有值。)

比如下面片段

复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script language='javascript'>
window.attachEvent( "onload", function(){ _resizeScroll2();} );
window.onresize=function(){winresize();};
function _resizeScroll2(){
var html1 = '<div id="divcj" style="margin-top:15px;font-size:10px;width:400px;">'
+ '<div style="float:left;width:50px;">测试</div>'
+ '<div style="float:left;width:320px;">danielinbiti</div>'
+ '</div>'
+ '<div id="divcj2" style="margin-top:15px;font-size:10px;width:400px;">'
+ '<div style="width:320px;">danielinbiti</div>'
+ '</div>'
document.getElementById('outer').innerHTML=html1;
document.getElementById('divcj2').style.display='none';
alert(document.getElementById('divcj2').offsetHeight);
}
</script>
</head>
<body>
<div id='outer'></div>
</body>
</html>

如果获取divcj的高度,那么在onload中获取到的是0。因为divcj下有float方式布局的。
这时如果div简单,可以借助隐藏层,比如这里的divcj2,把float去掉后,获取到的高度和divcj一样高。

时间: 2024-10-27 02:46:58

offsetHeight在OnLoad中获取为0的现象的相关文章

offsetHeight在OnLoad中获取为0的现象_javascript技巧

在使用IE中,特别在目前div+css的方式,往往不定义div的高度,这是在添加div内容后,需要获取div的高度时,往往需要用到offsetHeight. 在使用中,有时会碰到offsetHeight获取到为0的现象,但如果你用各种JS调试工具调试,又能在对象中看到值(如果直接指向offsetHeight是没值的,但如果是对象查看是有值的,在调试器中回车查看对象就已经刷新对象了,所以有值.) 比如下面片段 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C/

ITOO---MVC3.0动态添加表格的行数并Controller中获取添加数据

MVC3.0动态添加表格的行数并Controller中获取添加数据            最近由于项目的中的相关需求,需要在MVC的视图中动态的添加添加数据的行数,并将前台输入的多行数据在Controller中获得传回服务端.本文将介绍如何从MVC的View端动态添加数据行数并将输入的数据在Controller中获得.            问题分析          一.设计前台显示页面(View).            视图中样式 @*添加上课班信息窗口*@ <div id="Add

vc-VC6.0中文版本,如何在onsize中获取坐标?

问题描述 VC6.0中文版本,如何在onsize中获取坐标? 重写onsize后获取的cx坐标不正确,第一次调试是993px,第二次就报错.请问怎么回事,代码编译都是正常的 解决方案 你是不是有最小化的动作,参考:http://bbs.csdn.net/topics/390000500 解决方案二: 要获取鼠标指针坐标还是窗囗坐标?cx是窗口宽度,不是坐标. 解决方案三: 在 WM_SIZE 或者其对应的处理函数 onsize() 中获取窗体大小,首先要判断一下 第一个参数是否是:SIZE_MI

android 内存清理-Android 获取所有运行的程序,5.0系统以上中获取不到问题

问题描述 Android 获取所有运行的程序,5.0系统以上中获取不到问题 下面是我这个获取所有运行的程序的方法,为什么在5.0系统以上中却获取不到呢?有这方面了解的前辈么?请求指教! /** * 获取所有正在运行的程序 * @param context * @return */ public static List<Programe> getRunningProcess(Context context) { final ProgrameUtils proutils = new Program

javascript中获取class的简单实现_javascript技巧

js中没有获取class的办法,找了一些封装好的方法,这里整理一下 (1)先进行封装 //封装getClass function getClass(tagName,className) //获得标签名为tagName,类名className的元素 { if(document.getElementsByClassName) //支持这个函数 { return document.getElementsByClassName(className); } else { var tags=document

迭代-从数据库中获取的数据在jsp页面上的显示问题

问题描述 从数据库中获取的数据在jsp页面上的显示问题 做一个项目的时候,从数据库获取数据,用迭代的方式在前台显示,只能显示一部分的信息,就好像是有一个固定空间似的,只要内容超出了这个空间,就不能显示了,怎么解决? 代码如下: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@taglib uri=&

JavaScript中获取高度和宽度函数总结_javascript技巧

html代码: 复制代码 代码如下:  <body>      <div class="father" id="father">          <h3>这是父元素,屏幕分辨率是1366*768</h3>          <div class="son" id="son">              <h3>这是子元素,祝大家国庆快乐 </h3&

c3p0连接池中获取的Connection对象的close()方法是真的把连接给关闭了?

问题描述 c3p0连接池中获取的Connection对象的close()方法是真的把连接给关闭了? 自己做写了一个管理数据源的DBManager,构想中从数据源里面获取的Connection使用完之后执行close()方法,然后把Connection对象闲置回连接池中. 但是测试出来的结果好像每次执行close()之后connection就销毁了. 代码如下: DBManager.java package ben.DBUtils; import java.sql.Connection; impo

android-如何从电话的联系表中获取email?

问题描述 如何从电话的联系表中获取email? 我想从手机的联系列表中获取不同的电子邮件地址,比如工作,家庭住址等.我用的下面的代码,但是发现返回的结果是0.怎么回事啊? Cursor email = cr.query(ContactsContract.CommonDataKinds.Email.CONTENT_URI null Data.CONTACT_ID + "" ="" + id null null); while (email.moveToNext())