Wie erhalte ich mit jQuery die Höhe eines versteckten Elements?

Höhe verdeckter Elemente mit jQuery abrufen

Bei der Arbeit mit versteckten Elementen kann es aus verschiedenen Gründen erforderlich sein, deren Abmessungen abzurufen. Herkömmliche Methoden zum Ermitteln der Höhe eines Elements können jedoch fehlschlagen, wenn das Element nicht sichtbar ist.

Ineffizienter Ansatz

Der beschriebene Ansatz, das Element vorübergehend sichtbar zu machen und zu messen seine Höhe, und es dann wieder zu verstecken ist umständlich und ineffizient.

Alternative Lösung

jQuery bietet eine effizientere Lösung:

1. Elementattribute ändern: Die Stilattribute des Elements vorübergehend bearbeiten:

   • Position auf absolut setzen (optional, wenn das Element bereits absolut positioniert ist)
   • Setzen Sie die Sichtbarkeit auf „Ausgeblendet“ (machen Sie das Element unsichtbar)
   • Setzen Sie die Anzeige auf „Blockieren“ (machen Sie das Element sichtbar, aber nicht im Hauptdokumentfluss)
2. Messen Höhe: Rufen Sie die Höhe des Elements mithilfe der .height()-Methode von jQuery ab.
3. Attribute wiederherstellen: Setzen Sie die Stilattribute des Elements mithilfe der attr()-Methode oder auf ihre ursprünglichen Werte zurück indem Sie die Stileigenschaft direkt festlegen.

Codebeispiel

<code class="javascript">var previousCss = $("#myDiv").attr("style");

$("#myDiv").css({
    position: 'absolute',
    visibility: 'hidden',
    display: 'block'
});

var optionHeight = $("#myDiv").height();

$("#myDiv").attr("style", previousCss ? previousCss : "");</code>

Mit dieser Methode können Sie die Höhe eines ausgeblendeten Elements diskret messen, ohne das Layout zu beeinträchtigen oder Sichtbarkeit der Seite.

Das obige ist der detaillierte Inhalt vonWie erhalte ich mit jQuery die Höhe eines versteckten Elements?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!