logo

JavaScript ascunde elemente

În JavaScript, putem ascunde elementele folosind stil.afisaj sau prin utilizarea stil.vizibilitate . The vizibilitate proprietatea în JavaScript este folosită și pentru a ascunde un element. Diferența dintre stil.afisaj și stil.vizibilitate este atunci când se utilizează vizibilitate: ascuns, eticheta nu este vizibilă, dar spațiu este alocat. Folosind afișaj: niciunul, nici eticheta nu este vizibilă, dar nu există spațiu alocat pe pagină.

dubla în java

În HTML, putem folosi ascuns atribut pentru a ascunde elementul specificat. Cand ascuns atributul în HTML se setează la adevărat, elementul este ascuns sau când valoarea este fals, elementul este vizibil.

Sintaxă

Sintaxa generală pentru a ascunde un element folosind stil.ascuns și stil.vizibilitate este dat după cum urmează.

Folosind stil.ascuns

 document.getElementById('element').style.display = 'none'; 

Folosind stil.vizibilitate

forma completă ssh
 document.getElementById('element').style.visibility = 'none'; 

Acum, să vedem câteva exemple pentru a înțelege ascunderea elementelor javascript .

Exemplul 1

În acest exemplu, vom vedea cum să eliminați elemente folosind JavaScript stil.afisaj proprietate. Aici, există o div element și un element paragraf care se ascunde la clic pe dat butonul HTML . Trebuie să facem clic pe „Clic pe mine!” butonul pentru a vedea efectul.

 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(&apos;div&apos;).style.visibility = &apos;hidden&apos;; document.getElementById(&apos;heading&apos;).style.display = &apos;none&apos;; } 
Testează-l acum

Ieșire

În rezultat, putem vedea că div element (pe care am aplicat stil.vizibilitate proprietate) se ascunde, dar tot alocă spațiul. Dar titlul (pe care am aplicat stil.afisaj proprietate) se ascunde și nu alocă niciun spațiu.

ochi de primăvară
JavaScript ascunde elemente

După ce faceți clic pe butonul, rezultatul va fi -

JavaScript ascunde elemente