Wie kann ich die Sichtbarkeit von Elementen in JavaScript effizient bestimmen?

Bestimmen der Elementsichtbarkeit im DOM mit reinem JavaScript

Die Feststellung, ob ein Element im DOM sichtbar ist, ist für verschiedene Webentwicklungsaufgaben oft unerlässlich . Während jQuery eine einfache Lösung bietet, untersucht dieser Artikel einen reinen JavaScript-Ansatz.

Überprüfen von Elementattributen

Die Frage schlägt vor, Attribute wie Anzeige und Sichtbarkeit zu überprüfen, um die Sichtbarkeit zu bestimmen. Diese Attribute allein reichen jedoch möglicherweise nicht aus.

Element-Offset nutzen

Laut MDN-Dokumentation gibt die offsetParent-Eigenschaft eines Elements null zurück, wenn das Element oder seine Vorfahren dies sind durch die Anzeigeeigenschaft ausgeblendet. Dieser Ansatz ist geeignet, wenn keine Elemente mit der Position „fixed“ vorhanden sind.

function isHidden(el) {
    return (el.offsetParent === null);
}

Fensterstil für feste Elemente

Wenn positionsfixierte Elemente vorhanden sind, ist dies der Fall notwendig, um window.getComputedStyle() zu verwenden.

function isHidden(el) {
    var style = window.getComputedStyle(el);
    return (style.display === 'none');
}

Leistung Überlegungen

Option 2 mit window.getComputedStyle() ist umfassender, aber möglicherweise langsamer. Wenn dieser Vorgang häufig wiederholt wird, sollten Sie zur Leistungsoptimierung die Verwendung des Offset-Ansatzes in Betracht ziehen.

Das obige ist der detaillierte Inhalt vonWie kann ich die Sichtbarkeit von Elementen in JavaScript effizient bestimmen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!