如何判斷div是否受高度限制？

Question

我想知道如果div是高度受限或不使用jquery。

例如這個div被限制爲100px，無論內容的大小股利將有100px的高度：

<div style="height: 100px;"> 
     bla bla 
    </div> 

而這一次是不是約束，並會採取高度的它的內容：

<div> 
      bla bla 
    </div> 

換句話說，我想知道是否通過設置style屬性或單獨的css樣式來設置高度（以及如果是這樣）。 感謝

解決方案FF3.6 FF5 IE8 Chrome12和Opera11：

function css(a){ 
    var sheets = document.styleSheets; 
    var o={}; 
    var name; 
    var i=0; 
    while (i<sheets.length) { 
    var rules = sheets[i].rules || sheets[i].cssRules; 
    var r=0; 
    while(r<rules.length) { 
      if(typeof(rules[r].style)!="undefined" && 
      !rules[r].selectorText.match(":before") && // fix for FF3.6 
      !rules[r].selectorText.match(":after") && 
      !rules[r].selectorText.match(":link") && 
      !rules[r].selectorText.match(":hover") && 
      !rules[r].selectorText.match(":active") && 
      !rules[r].selectorText.match(":visited") && 
      !rules[r].selectorText.match(":first-letter") && 
      !rules[r].selectorText.match(":-moz-focus-inner") && 
       a.is(rules[r].selectorText)) { 
       o = $.extend(o, css2json(rules[r].style), css2json(a.attr('style'))); 
      } 
     r++; 
     } 
    i++; 
    } 
    return o; 
} 

function css2json(css){ 
    var s = {}; 
    if(!css) return s; 

    var isMSIE = /*@cc_on!@*/0; 

    if (isMSIE) 
     { 
     if(typeof(css)=="object") 
      { 
      for(var i in css) { 
       if(i.toLowerCase) 
       s[i.toLowerCase()] = css[i]; 
      } 
      } 
     else if(typeof css == "string") 
      { 
      css = css.split("; ");   
      for (var i in css) { 
       var l = css[i].split(": "); 
       s[l[0].toLowerCase()] = (l[1]); 
      }; 
      } 
     } 
    else 
     { 
     if(css instanceof CSSStyleDeclaration) 
      { 
      for(var i in css) { 
       if((css[i]).toLowerCase) 
       s[(css[i]).toLowerCase()] = (css[css[i]]); 
      } 
      } 
     else if(typeof css == "string") 
      { 
      css = css.split("; ");   
      for (var i in css) { 
       var l = css[i].split(": "); 
       s[l[0].toLowerCase()] = (l[1]); 
      }; 
      }    
     } 
    return s; 
} 



...   
alert(css($('some selector')).height); 

Answer 1

使用this answer提供的功能，您可以訪問該元素的高度是這樣的：

css($('div')).height 

這些函數說明了內聯和繼承樣式，我相信這是你想要的。如果高度沒有明確指定，返回對象的height屬性將爲undefined。

Demo

Answer 2

至於我可以告訴大家有知道的高度已設置的元件上，或者沒有沒有直接的辦法。

但是，在我周圍搜索時發現了一個我認爲會很好的想法。

它基本上涉及克隆你想知道的元素，向克隆中添加一個類，該類的高度設置爲一個不太可能被使用的值，然後進行測試。

這裏我只是放在一起，以測試這種方法：

function IsHeightSet(id) 
{ 
    var clone = $(id).clone(); 
    clone.addClass('magicHeight'); 

    return (clone.height() == 1069)? false : true; 
} 

和CSS類magicHeight：

.magicHeight 
{ 
    height: 1069px; 
} 

然後，我們可以用它來測試一個給定的元素是否有高度是否指定。

下面是這段代碼的工作示例：http://jsfiddle.net/mnpey/1/