javascript--元素的尺寸

 获取元素的当前高度和宽度

function getHeight(elem) { return parseInt(getStyle(elem,"height")); } function getWidth() { return parseInt(getStyle(elem,"width")); }

但是当我们试图做下面两件事情是，会出现问题。一是 需要获取有预定义高度元素的完整噶度。比如，以0像素开始的动画，但我们需要事先知道元素究竟能有多少高或者宽。二是，当元素的display为none的时候，我们会得不到这个数值。在需要执行动画的时候这两个问题就会发生。一个对象的动画从0像素开始也可能是display为none，这个时候需要把高度增大到他潜在的尺寸。

下面的两个函数展示了如何找到元素的潜在的完整高度和宽度。需要通过访问clientWidth和clientHeight属性来实现，他们提供了元素可能达到的总尺寸。

即使元素隐藏，亦能分别获取他潜在的完整高度和宽度的两个函数。

function fullHeight(elem) { if(getStyle(elem,"display")!="none") return elem.offsetHeight||getHeight(elem); var old=resetCSS(elem,{ display:'', visibility:'hidden', position:'absolute' }); var h=elem.clientHeight||getHeight(elem); restoreCSS(elem,old); return h; } function fullWidth(elem) { if(getStyle(elem,"display")!="none") return elem.offsetWidth||getWidth(elem); var odl=resetCSS(elem,{ display:'', visibility:'hidden', position:'absolute' }); var w=elem.clientWidth||getWidth(elem); restoreCSS(elem,old); return w; } function resetCSS(elem,prop) { var old=[]; for(var i in prop) { old[i]=elem.style[i]; elem.style[i]=prop[i]; return old; } } function restoreCSS(elem,prop) { for(var i in prop) { elem.style[i]=prop[i]; } }

有了获取元素的高度和宽度或者潜在高度宽度的能力就可以设置一些动画了 。