Maison > Article > interface Web > Comment résoudre le problème que Firefox utilise offsetHeight pour obtenir la hauteur d'un div, qui est 0
Comment résoudre le problème que Firefox utilise offsetHeight pour obtenir la hauteur d'un div, qui est 0
- 不言original
- 2018-06-21 16:33:502170parcourir
Lorsque Firefox a besoin d'obtenir la hauteur de p, il doit souvent utiliser offsetHeight. Parfois, il rencontre le phénomène selon lequel offsetHeight est 0. Voici une solution plus pratique pour tout le monde. Les amis intéressés peuvent s'y référer
Lorsque Firefox a besoin d'obtenir la hauteur de p, il doit souvent utiliser offsetHeight. Parfois, offsetHeight est obtenu à 0. Lors de l'utilisation d'IE ou de Firefox, en particulier dans le p+css actuel. la hauteur de p n'est souvent pas définie. En effet, après avoir ajouté le contenu de p, lorsque vous devez obtenir la hauteur de p, vous devez souvent utiliser offsetHeight. En cours d'utilisation, vous pouvez parfois rencontrer le phénomène selon lequel offsetHeight est obtenu à 0, mais si vous utilisez divers outils de débogage JS pour déboguer, vous pouvez voir la valeur dans l'objet (cela ne sert à rien si vous le pointez directement à offsetHeight , mais si la vue de l'objet a une valeur, l'objet a été actualisé en appuyant sur Entrée dans le débogueur, il a donc une valeur) Par exemple, l'extrait suivant Le code est la suivante :<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script language='javascript'>
window.attachEvent( "onload", function(){ _resizeScroll2();} );
window.onresize=function(){winresize();};
function _resizeScroll2(){
var html1 = '<p id="pcj" style="margin-top:15px;font-size:10px;width:400px;">'
+ '<p style="float:left;width:50px;">测试</p>'
+ '<p style="float:left;width:320px;">danielinbiti</p>'
+ '</p>'
+ '<p id="pcj2" style="margin-top:15px;font-size:10px;width:400px;">'
+ '<p style="width:320px;">danielinbiti</p>'
+ '</p>'
document.getElementById('outer').innerHTML=html1;
document.getElementById('pcj2').style.display='none';
alert(document.getElementById('pcj2').offsetHeight);
}
</script>
</head>
<body>
<p id='outer'></p>
</body>
</html>Si vous obtenez la hauteur de pcj, vous obtenez 0 en onload. Parce qu'il existe une disposition flottante sous pcj. Si p est simple à ce stade, vous pouvez utiliser le calque caché, comme pcj2 ici. Après avoir retiré le flotteur, la hauteur obtenue est aussi élevée que pcj. Un point clé ici est que la disposition float convient dans IE, mais pour Firefox, elle est 0 Ce qui précède représente l'intégralité du contenu de cet article, j'espère qu'il sera utile à tout le monde Aide à l'apprentissage, veuillez faire attention au site Web PHP chinois pour plus de contenu connexe ! Recommandations associées :
Partage de solutions pour améliorer la compatibilité des navigateurs des balises vidéo en HTML5
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn