在實際開發中會遇到確實需要獲取隱藏元素的寬高，這兒所說的隱藏元素是display為none的元素。

可使用jQuery Actual Plugin插件來完成，其源碼如下：

;( function ( $ ){ $.fn.addBack = $.fn.addBack || $.fn.andSelf; $.fn.extend({  actual : function ( method, options ){   // check if the jQuery method exist   if( !this[ method ]){    throw '$.actual => The jQuery method "' + method + '" you called does not exist';   }   var defaults = {    absolute   : false,    clone     : false,    includeMargin : false,    display    : 'block'   };   var configs = $.extend( defaults, options );   var $target = this.eq( 0 );   var fix, restore;   if( configs.clone === true ){    fix = function (){     var style = 'position: absolute !important; top: -1000 !important; ';     // this is useful with css3pie     $target = $target.      clone().      attr( 'style', style ).      appendTo( 'body' );    };    restore = function (){     // remove DOM element after getting the width     $target.remove();    };   }else{    var tmp  = [];    var style = '';    var $hidden;    fix = function (){     // get all hidden parents     $hidden = $target.parents().addBack().filter( ':hidden' );     style  += 'visibility: hidden !important; display: ' + configs.display + ' !important; ';     if( configs.absolute === true ) style += 'position: absolute !important; ';     // save the origin style props     // set the hidden el css to be got the actual value later     $hidden.each( function (){      // Save original style. If no style was set, attr() returns undefined      var $this   = $( this );      var thisStyle = $this.attr( 'style' );      tmp.push( thisStyle );      // Retain as much of the original style as possible, if there is one      $this.attr( 'style', thisStyle ? thisStyle + ';' + style : style );     });    };    restore = function (){     // restore origin style values     $hidden.each( function ( i ){      var $this = $( this );      var _tmp = tmp[ i ];      if( _tmp === undefined ){       $this.removeAttr( 'style' );      }else{       $this.attr( 'style', _tmp );      }     });    };   }   fix();   // get the actual value with user specific methed   // it can be 'width', 'height', 'outerWidth', 'innerWidth'... etc   // configs.includeMargin only works for 'outerWidth' and 'outerHeight'   var actual = /(outer)/.test( method ) ?    $target[ method ]( configs.includeMargin ) :    $target[ method ]();   restore();   // IMPORTANT, this plugin only return the value of the first element   return actual;  } });})(jQuery);

當然如果要支持模塊化開發，直接使用官網下載的文件即可，源碼也貼上：

;( function ( factory ) {if ( typeof define === 'function' && define.amd ) {  // AMD. Register module depending on jQuery using requirejs define.  define( ['jquery'], factory );} else {  // No AMD.  factory( jQuery );}}( function ( $ ){ $.fn.addBack = $.fn.addBack || $.fn.andSelf; $.fn.extend({  actual : function ( method, options ){   // check if the jQuery method exist   if( !this[ method ]){    throw '$.actual => The jQuery method "' + method + '" you called does not exist';   }   var defaults = {    absolute   : false,    clone     : false,    includeMargin : false,    display    : 'block'   };   var configs = $.extend( defaults, options );   var $target = this.eq( 0 );   var fix, restore;   if( configs.clone === true ){    fix = function (){     var style = 'position: absolute !important; top: -1000 !important; ';     // this is useful with css3pie     $target = $target.      clone().      attr( 'style', style ).      appendTo( 'body' );    };    restore = function (){     // remove DOM element after getting the width     $target.remove();    };   }else{    var tmp  = [];    var style = '';    var $hidden;    fix = function (){     // get all hidden parents     $hidden = $target.parents().addBack().filter( ':hidden' );     style  += 'visibility: hidden !important; display: ' + configs.display + ' !important; ';     if( configs.absolute === true ) style += 'position: absolute !important; ';     // save the origin style props     // set the hidden el css to be got the actual value later     $hidden.each( function (){      // Save original style. If no style was set, attr() returns undefined      var $this   = $( this );      var thisStyle = $this.attr( 'style' );      tmp.push( thisStyle );      // Retain as much of the original style as possible, if there is one      $this.attr( 'style', thisStyle ? thisStyle + ';' + style : style );     });    };    restore = function (){     // restore origin style values     $hidden.each( function ( i ){      var $this = $( this );      var _tmp = tmp[ i ];      if( _tmp === undefined ){       $this.removeAttr( 'style' );      }else{       $this.attr( 'style', _tmp );      }     });    };   }   fix();   // get the actual value with user specific methed   // it can be 'width', 'height', 'outerWidth', 'innerWidth'... etc   // configs.includeMargin only works for 'outerWidth' and 'outerHeight'   var actual = /(outer)/.test( method ) ?    $target[ method ]( configs.includeMargin ) :    $target[ method ]();   restore();   // IMPORTANT, this plugin only return the value of the first element   return actual;  } });}));