<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
html如何加入上述声明后使用javascript取得document.body.clientHeight竟然是0,真晕.
分别用IE和FF做了测试,代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script language="javascript" type="text/javascript">
function init(){
alert(
"clientHeight:"+document.body.clientHeight+"\n"+
"offsetHeight:"+document.body.clientHeight+"\n"
);
}
</script>
<style>
</style>
<title>TEST</title>
</head>
<body onload="init();">
<div id="ABC" style="height:1030px;"></div>
</body>
</html>
结果:
IE: clientHeight:1030,offsetHeight:1030
FF: clientHeight:1030,offsetHeight:1030
clientHeight和offsetHeight竟然是一样的????
怎么会这样,我想得到浏览区域的高度,怎样做才是呢?
------------------------------------------------------------------------------------
加入CSS后:
<style><!--
html,body{ height:100%; }
--></style>
<div id="ABC" style="height:1030px;"></div>
function init(){
alert(
"clientHeight:"+document.body.clientHeight+"\n"+
"offsetHeight:"+document.body.clientHeight+"\n"
);
}
得出的结果:
IE:clientHeight:1030,offsetHeight:1030
FF: clientHeight:514,offsetHeight:514
看出,增加CSS后,FF的clientHeight得到了我要的结果,但IE仍然是1030,非常郁闷,
望高手指点.
-------------------------------------------------------------------------------------- 在ie5.5上测试了加入css后的代码,
ie5.5得到的结果是:clientHeight:498,offsetHeight:498
可见ie5.5也是我要的结果,但怎么ie6就这么奇怪呢?
-------------------------------------------------------------------------------------- 没人顶啊,随便顶一下结了算,别浪费分.
-------------------------------------------------------------------------------------- IE6.0、FF1.06+：
clientWidth = width + padding
clientHeight = height + padding
offsetWidth = width + padding + border
offsetHeight = height + padding + border
IE5.0/5.5：
clientWidth = width - border
clientHeight = height - border
offsetWidth = width
offsetHeight = height
(需要提一下：CSS中的margin属性，与clientWidth、offsetWidth、clientHeight、offsetHeight均无关)
-------------------------------------------------------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script language="javascript" type="text/javascript">
function init(){
alert(document.documentElement.clientHeight+"\n");
}
</script>
<style>
</style>
<title>TEST</title>
</head>
<body onload="init();">
<div id="ABC" style="height:1030px;"></div>
</body>
</html>