Nascondere un elemento, ad esempio un div, da una pagina HTML può essere usato per dare il sito un aspetto più dinamico. Ad esempio, su un blog, si potrebbe desiderare visitatori di essere in grado di fare clic su un pulsante per nascondere i commenti del post di blog. Nascondere tutti i div in una pagina può essere ottenuto utilizzando JavaScript per modificare il Document Object Model, in particolare CSS attributo di ogni elemento "di visualizzazione."

istruzione

1 Creare un file e aprirlo con un editor di testo, ad esempio WordPad.

2 Scrivere il codice HTML per un certo numero di elementi div e non div. Ecco un esempio:

<Div> A div </ div>

<Div> Un altro div </ div>

<P> Un paragrafo </ p>

3 Scrivere il codice HTML per un elemento pulsante. Impostare gli elementi "onclick" proprietà su "hideDivs ()." Ciò farà sì che la funzione "hideDivs" da chiamare quando viene premuto il pulsante. Ecco un esempio del codice:

<button onclick = "hideDivs ()"> Nascondi div <button />

4 Nella parte superiore del file di, scrivere un paio di apertura e chiusura tag script. Questi conterranno il codice JavaScript. Ecco un esempio:

<Script>

</ Script>

5 Tra i tag di script, scrivere il codice per una funzione JavaScript denominata "hideDivs." La funzione deve eseguire le seguenti tre fasi. In primo luogo, ottenere ogni elemento div in un array chiamando la funzione "document.getElementsByTagName" con div come parametro e memorizzare il risultato in una variabile. In secondo luogo, un ciclo su ogni elemento dell'array utilizzando un ciclo "for". In terzo luogo, all'interno del ciclo, impostare gli elementi attuali style.display proprietà su "nessuno". Ecco il codice:

hideDivs function () {

var elems = document.getElementsByTagName ( "div");

for (i = 0; i <elems.length; i ++) {

elems [i] .style.display = "none";

}}