Comment obtenir la hauteur des éléments cachés en javascript

Méthode d'acquisition : 1. Introduisez le fichier jquery ; 2. Utilisez l'instruction "$("#id value")" pour obtenir l'objet élément caché en fonction de la valeur id spécifiée ; )" pour obtenir la hauteur de l'élément caché.

L'environnement d'exploitation de ce tutoriel : système windows7, version javascript1.8.5&&jquery3.1.0, ordinateur Dell G3.

Tout d'abord, dans des circonstances normales, assurez-vous que le div a une hauteur.

nbsp;html>


    <meta>
    <title>Document</title>
    <script></script>


    <div>
        <div>
            子div内容，需要获取我的高度
        </div>
    </div>

<script>
    console.log($("#div").height())  //21
    console.log($("#divsub").height()) //21
</script>

Lorsque nous ajoutons style="display:none;" à l'élément avec l'identifiant de div, réexécutez le code et le résultat est le suivant : style="display:none;" 之后，重新运行代码，结果如下：

可以看到，父div能正常获取值，而子div已经获取不到高度了。

当我们把 style="display:none;" 改成 style="visibility: hidden;"

Vous pouvez voir que le parent div peut obtenir la valeur normalement, et l'enfant div ne peut plus obtenir la hauteur.

Lorsque nous changeons style="display:none;" en style="visibility: Hidden;" , nous pouvons toujours l'obtenir normalement. Mais la position du div est toujours là.

Donc, il existe la solution suivante, utilisez la visibilité pour le masquer, puis déplacez le div vers un endroit invisible en dehors de l'écran. 🎜

nbsp;html>


    <meta>
    <title>Document</title>
    <script></script>


    <div>
        <div>
            子div内容，需要获取我的高度
        </div>
    </div>

<script>
    console.log($("#div").height())  
    console.log($("#divsub").height())
</script>

🎜【Apprentissage recommandé : 🎜Tutoriel avancé javascript🎜】🎜

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!