Car*_*ter 7 javascript jquery dom
所以我有一个div,其内容是在运行时生成的,它最初没有与之关联的高度.当它根据firebug生成时,我可以通过js警告,div仍然具有0的高度.但是,用firebug查看只读属性我可以看到它的偏移高度为34.这个值是我需要.希望它是显而易见的,但如果不是,这个数字是可变的,它并不总是38.
所以,我认为我可以通过jquery做到这一点......
$("#parentDiv").attr('offsetHeight');
或者用直js ...
document.getElementById("parentDiv").offsetHeight;
但返回的所有内容都是0.它是否与偏移高度在此实例中是只读属性这一事实有关？我怎么能得到这个高度？我的意思是萤火虫以某种方式搞清楚它似乎我应该能够.
编辑: 这是div现在的样子......
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN"><META http-equiv="Content-Type" content="text/html; charset=utf-8">
<HTML style="OVERFLOW: hidden; HEIGHT: 100%" xmlns="http://www.w3.org/1999/xhtml"><BODY><FORM id="aspnetForm" name="aspnetForm" action="blah.aspx" method="post"><DIV id="container">
<DIV id="ctl00_BodyContentPlaceHolder_Navigation" style="Z-INDEX: 1; LEFT: 1597px; POSITION: absolute; TOP: 67px">
<DIV class="TransparentBg" id="TransparentDiv" style="MARGIN-TOP: 10px; MARGIN-RIGHT: 10px; HEIGHT: 94px; TEXT-ALIGN: center">
</DIV>
<DIV class="Foreground" id="ForegroundId" style="MARGIN-TOP: 10px; MARGIN-RIGHT: 10px; TEXT-ALIGN: center">
<DIV id="ctl00_BodyContentPlaceHolder_Navigation1" style="WIDTH: 52px; COLOR: black; HEIGHT: 52px; BACKGROUND-COLOR: transparent; -moz-user-focus: normal">
<IMG style="FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod = scale src='../images/image.gif'); CURSOR: pointer" height="52" hspace="0" src="..." width="52" />
</DIV>
<DIV id="ctl00_BodyContentPlaceHolder_UserControl" name="ctl00_BodyContentPlaceHolder_UserControl">
<IMG style="DISPLAY: block; VERTICAL-ALIGN: bottom; CURSOR: pointer" height="17" src="..." width="16" />
<IMG style="VERTICAL-ALIGN: top; CURSOR: pointer" height="17" src="..." width="16" />
</DIV>
</DIV>
</DIV>
</DIV></FORM></BODY></HTML>
此代码由单独库中的控件生成.所以这是在我的.aspx页面中创建它的实际代码.
<blah:blahControl ID="control" runat="server" />
好吧,它略有编辑,但是比我之前的HTML要多得多.我之前称为"parentDiv"的div在那里被称为"ctl00_BodyContentPlaceHolder_UserControl".该代码包括有问题的div,它是兄弟姐妹,父母,祖父母和孩子.这几乎是萤火虫的直接拷贝.
更新: 我应该已经提到这是在IE 7中完成的.它似乎在Firefox中运行一次,但它现在返回0.这是否提供了可能的解决方法或任何新的见解？
......你们都必须认为我疯了.
更新: 一些造型......
.TransparentBg
{
background-color: white;
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}
.Foreground
{
position: absolute;
top: 0px;
}
您确定元素是否包含在文档树中并呈现？(即不是"display:none",但"visibility:hidden"是可以的.)
实际上没有参与文档渲染过程的元素没有维度,并且offsetWidth/Height为0.
添加代码示例后的ETA:使用您的确切代码,我在"17"的div上得到offsetHeight.第一个图像大小正确,第二个没有大小.
这与渲染(*)一样正确.任何无法加载的图像都会被替换为替换文本作为内联跨度.您的图片没有替代文字,因此它被替换为空字符串.通常,作为内联元素,不能将其设置为任何特定大小.例外是第一个图像,因为你已经给它'display:block',这使得它适合宽度/高度提供的显式尺寸.
在Quirks模式中,您可能会得到与图像应该相同的"破碎图像"图标.这在标准模式下不会发生,因为如果您使用标准,则假定您知道如何正确使用替代文本.
无论哪种方式,如果我用实际工作地址替换"..."URL,尺寸测量对我来说很好.
(*:虽然你实际上看不到它,因为html和'left:1597px;'组合上相当奇怪的'溢出隐藏'.嗯,除非你有一个非常宽的监视器!)