首頁 > web前端 > js教程 > 主體

JS取得一個未知DIV高度的方法

高洛峰
發布: 2016-12-24 15:05:37
原創
1439 人瀏覽過

本文實例講述了JS取得一個未知DIV高度的方法。分享給大家供大家參考,具體如下:

透過元素的clientHeight屬性能夠得到元素的高度,如:

var height = element.clientHeight;
登入後複製

   

這種做法的限制:

1.

這種做法的限制:

, 那麼得到的結果為0

2. 在safari瀏覽器中,需要使用:element.offsetHeight得到實際高度,這是safari瀏覽器的bug

下面是Prototype提供的方法,能夠兼容各種瀏覽器,同時在元素隱藏的情況下也能正確得到元素尺寸,供參考:

getDimensions: function(element) {
  element = $(element);
  var display = $(element).getStyle('display');
  if (display != 'none' && display != null) // Safari bug
   return {width: element.offsetWidth, height: element.offsetHeight};
  // All *Width and *Height properties give 0 on elements with display none,
  // so enable the element temporarily
  var els = element.style;
  var originalVisibility = els.visibility;
  var originalPosition = els.position;
  var originalDisplay = els.display;
  els.visibility = 'hidden';
  els.position = 'absolute';
  els.display = 'block';
  var originalWidth = element.clientWidth;
  var originalHeight = element.clientHeight;
  els.display = originalDisplay;
  els.position = originalPosition;
  els.visibility = originalVisibility;
  return {width: originalWidth, height: originalHeight};
}
登入後複製
   


希望本文所述對大家JavaScript程式設計有所幫助。


更多JS取得一個未知DIV高度的方法相關文章請關注PHP中文網!

🎜🎜🎜
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!