获取元素的宽和高

1、获取窗口的文档显示区的宽度和高度。

//包含滚动条window.innerHeightwindow.innerWidth//不包含滚动条document.documentElement.clientHeightdocument.documentElement.clientWidth

2、获取document的宽度和高度

//name: width/heightfunction getWidthOrHeight(name){  doc = document.documentElement;  // Either scroll[Width/Height] or offset[Width/Height] or client[Width/Height],  // whichever is greatest  return Math.max(    document.body[ "scroll" + name ], doc[ "scroll" + name ],    document.body[ "offset" + name ], doc[ "offset" + name ],    doc[ "client" + name ]  );}

3、获取element的宽度和高度

//elem: 计算样式的元素; name: width/heightfunction getWidthOrHeight(elem, name){  var view = elem.ownerDocument.defaultView;  if ( !view || !view.opener ) {    view = window;  }  var computed = view.getComputedStyle( elem );  ret = computed.getPropertyValue( name ) || computed[ name ];  if ( ret === "auto" ) {        ret = elem[ "offset" + name[ 0 ].toUpperCase() + name.slice( 1 ) ];    };    return ret;}

elem.style：js只能从这个属性获取写在html标签中style属性中的值style="..."，而无法获取定义在<style type="text/css">...<style>里面的属性的值。
因此可以使用getComputedStyle()方法。这个方法接受两个参数：要计算样式的元素和一个伪元素字符串（例如":after"）。如果不需要伪元素信息，第二个参数可以是null。getComputerStyle()方法返回一个CSSStyleDeclaration对象，其中包含当前元素的所有计算的样式。