In JavaScript können wir die Elemente mithilfe von ausblenden Stil.Anzeige oder indem Sie die verwenden Stil.Sichtbarkeit . Der Sichtweite Die Eigenschaft in JavaScript wird auch zum Ausblenden eines Elements verwendet. Der Unterschied zwischen dem Stil.Anzeige Und Stil.Sichtbarkeit ist bei der Verwendung Sichtbarkeit: versteckt, Das Tag ist nicht sichtbar, es ist jedoch Platz zugewiesen. Benutzen Anzeige: keine, Das Tag ist ebenfalls nicht sichtbar, es ist jedoch kein Platz auf der Seite zugewiesen.
In HTML können wir das verwenden versteckt Attribut, um das angegebene Element auszublenden. Wenn das versteckt Wenn das Attribut in HTML auf „true“ gesetzt ist, ist das Element ausgeblendet oder der Wert ist ausgeblendet FALSCH, Das Element ist sichtbar.
Syntax
Die allgemeine Syntax zum Ausblenden eines Elements Stil.versteckt Und Stil.Sichtbarkeit ist wie folgt gegeben.
Benutzen Stil.versteckt
document.getElementById('element').style.display = 'none';
Benutzen Stil.Sichtbarkeit
document.getElementById('element').style.visibility = 'none';
Sehen wir uns nun einige Beispiele an, um das Verstecken von Elementen zu verstehen Javascript .
Beispiel 1
In diesem Beispiel sehen wir, wie Elemente mithilfe von JavaScript entfernt werden Stil.Anzeige Eigentum. Hier gibt es eine div Element und ein Absatzelement, das beim Klicken auf das angegebene Element ausgeblendet wird HTML-Schaltfläche . Wir müssen auf klicken 'Klick mich!' Klicken Sie auf die Schaltfläche, um den Effekt zu sehen.
style.display <h2> Using both style.visibility and style.display properties </h2> This is the div element. <p> This is a paragraph element. </p> <h3 id="heading"> This is the heading after the paragraph element. </h3> Click me! function fun() { document.getElementById('div').style.visibility = 'hidden'; document.getElementById('heading').style.display = 'none'; } Testen Sie es jetzt Ausgabe
In der Ausgabe können wir sehen, dass die div Element (auf das wir angewendet haben Stil.Sichtbarkeit Eigentum) versteckt sich, weist aber dennoch den Platz zu. Aber die Überschrift (auf die wir uns beworben haben Stil.Anzeige Eigentum) versteckt sich und weist keinen Platz zu.
Nach dem Klicken auf die Schaltfläche wird das Ergebnis wie folgt angezeigt:
