JavaScript, ecco come mostrare o nascondere un DIV

Pubblicato il 22 Ottobre 2008

Vediamo oggi, con un semplice esempio, come mostrare o nascondere un DIV in una pagina HTML.

Creiamo un DIV e chiamiamolo “content” digitando poi un testo al suo interno:

<div id=”content”>
Questo è il div da mostrare o nascondere
</div>

All’interno della pagina HTML posizioniamo due pulsanti che, rispettivamente, mostreranno o nasconderanno il DIV richiamando un’opportuna funzione JavaScript:

<input type=”button” value=”Mostra” onclick=”javascript:mostra()” />
<input type=”button” value=”Nascondi” onclick=”javascript:nascondi()” />

Le due funzioni JavaScript (mostra / nascondi), agendo sulla proprietà display del DIV, ci permetteranno di mostrare il div (block) o di nasconderlo (none):

function mostra() {
document.getElementById(“content”).style.display=”block”;
}

function nascondi() {
document.getElementById(“content”).style.display=”none”;
}

Autore: emawebdesign

Full Stack Developer, SEO Specialist, esperto della trasformazione digitale con oltre 20 anni di esperienza.

Pubblicato in: