Heim > Artikel > Web-Frontend > So lösen Sie das Problem, dass Firefox offsetHeight verwendet, um die Höhe eines Divs zu ermitteln, die 0 ist

So lösen Sie das Problem, dass Firefox offsetHeight verwendet, um die Höhe eines Divs zu ermitteln, die 0 ist

不言Original: 2018-06-21 16:33:502204Durchsuche

Wenn Firefox die Höhe von p erhalten muss, muss es häufig offsetHeight verwenden. Manchmal tritt das Phänomen auf, dass offsetHeight 0 ist. Hier ist eine praktischere Lösung für alle.

Wenn Firefox die Höhe von p erhalten muss, muss oft offsetHeight verwendet werden. Manchmal wird offsetHeight als 0 erhalten.

Bei Verwendung von IE oder Firefox, insbesondere im aktuellen p+css Die Höhe von p ist häufig nicht definiert, da Sie nach dem Hinzufügen des Inhalts von p häufig offsetHeight verwenden müssen, wenn Sie die Höhe von p ermitteln möchten.

Bei der Verwendung werden Sie manchmal auf das Phänomen stoßen, dass offsetHeight als 0 erhalten wird. Wenn Sie jedoch verschiedene JS-Debugging-Tools zum Debuggen verwenden, können Sie den Wert im Objekt sehen (er ist wertlos, wenn Sie direkt darauf zeigen). zu offsetHeight , aber wenn die Objektansicht einen Wert hat, wurde das Objekt durch Drücken der Eingabetaste im Debugger aktualisiert, sodass es einen Wert hat)

Zum Beispiel das folgende Snippet

Der Code lautet wie folgt:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
<script language=&#39;javascript&#39;> 
window.attachEvent( "onload", function(){ _resizeScroll2();} ); 
window.onresize=function(){winresize();}; 
function _resizeScroll2(){ 
var html1 = &#39;<p id="pcj" style="margin-top:15px;font-size:10px;width:400px;">&#39; 
+ &#39;<p style="float:left;width:50px;">测试</p>&#39; 
+ &#39;<p style="float:left;width:320px;">danielinbiti</p>&#39; 
+ &#39;</p>&#39; 
+ &#39;<p id="pcj2" style="margin-top:15px;font-size:10px;width:400px;">&#39; 
+ &#39;<p style="width:320px;">danielinbiti</p>&#39; 
+ &#39;</p>&#39; 
document.getElementById(&#39;outer&#39;).innerHTML=html1; 
document.getElementById(&#39;pcj2&#39;).style.display=&#39;none&#39;; 
alert(document.getElementById(&#39;pcj2&#39;).offsetHeight); 
} 
</script> 
</head> 
<body> 
<p id=&#39;outer&#39;></p> 
</body> 
</html>

Wenn Sie die Höhe von pcj erhalten, erhalten Sie 0 im Onload. Weil es unter pcj ein Float-Layout gibt.

Wenn p zu diesem Zeitpunkt einfach ist, können Sie die verborgene Ebene verwenden, z. B. hier pcj2. Nach dem Entfernen des Floats ist die erhaltene Höhe so hoch wie pcj.

Ein wichtiger Punkt hier ist, dass das Float-Layout im IE in Ordnung ist, für Firefox jedoch 0.

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für alle hilfreich sein Hilfe beim Lernen, bitte beachten Sie die PHP-Chinese-Website für weitere verwandte Inhalte!

Verwandte Empfehlungen:

Austausch von Lösungen zur Verbesserung der Browserkompatibilität von Video-Tags in HTML5

Das obige ist der detaillierte Inhalt vonSo lösen Sie das Problem, dass Firefox offsetHeight verwendet, um die Höhe eines Divs zu ermitteln, die 0 ist. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

php html5 css Float JS 对象

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：So erstellen Sie ein flüssiges Layout mit adaptiver Breite mithilfe negativer CSS-RänderNächster Artikel：So erstellen Sie ein flüssiges Layout mit adaptiver Breite mithilfe negativer CSS-Ränder

In Verbindung stehende Artikel

Mehr sehen