A JavaScript, podem amagar els elements mitjançant l' estil.visualització o utilitzant el estil.visibilitat . El visibilitat La propietat en JavaScript també s'utilitza per ocultar un element. La diferència entre el estil.visualització i estil.visibilitat és quan s'utilitza visibilitat: oculta, l'etiqueta no és visible, però hi ha espai assignat. Utilitzant pantalla: cap, l'etiqueta tampoc és visible, però no hi ha espai assignat a la pàgina.
En HTML, podem utilitzar el amagat atribut per ocultar l'element especificat. Quan el amagat l'atribut en HTML es defineix com a true, l'element està ocult o quan el valor ho és fals, l'element és visible.
cadena comparada
Sintaxi
La sintaxi general per ocultar un element utilitzant estil.amagat i estil.visibilitat es dóna de la següent manera.
Utilitzant estil.amagat
document.getElementById('element').style.display = 'none';
Utilitzant estil.visibilitat
document.getElementById('element').style.visibility = 'none';
Ara, vegem alguns exemples per entendre l'amagat d'elements javascript .
pagar amb git
Exemple 1
En aquest exemple, veurem com eliminar elements mitjançant JavaScript estil.visualització propietat. Aquí, hi ha un div element i un element de paràgraf que s'amaga en fer clic al dat botó HTML . Hem de fer clic a 'Clica'm!' botó per veure l'efecte.
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'; } Prova-ho ara Sortida
A la sortida, podem veure que el div element (sobre el qual hem aplicat estil.visibilitat propietat) s'amaga però encara assignant l'espai. Però l'encapçalament (sobre el qual hem aplicat estil.visualització propietat) s'amaga i no assigna cap espai.
Després de fer clic al botó, el resultat serà -
