本文介绍使用JavaScript获取元素scrollHeight并设置最大高度以实现两个DIV等高的方法。代码通过document.getElementById获取元素,利用Math.max确定最高值并赋值给height属性。文章同时指出该方案在IE下正常,但在Firefox中需刷新才能生效的问题,寻求更优解决方案。
JavaScript实现DIV等高布局及兼容性问题
为了控制两个DIV元素保持高度一致,我在网页底部使用了以下JavaScript代码。
具体实现代码如下:
<script type="text/javascript">
var mainCon=document.getElementById("sidebar-right").scrollHeight
var sidebar=document.getElementById("center").scrollHeight
layoutHeight=Math.max(mainCon,sidebar)
document.getElementById("sidebar-right").style.height=layoutHeight+"px"
document.getElementById("center").style.height=layoutHeight+"px"
</script> 该方案在IE浏览器中运行正常,但在Firefox浏览器中,每次访问都需要刷新一次页面才能自动拉伸高度。是否有更好的方法可以解决这一问题?