Nwlapcug.com


Come nascondere più div in JavaScript

Come nascondere più div in JavaScript


Potrebbe essere pagine Web che contengono una grande quantità di dati. Fare alcuni div della pagina Web, o livello di blocco HTML-definito divisioni, pieghevole per mantenere gli utenti del sito di essere sopraffatto con i dati. Creare una funzione JavaScript per controllare la visualizzazione di dati. Impostare la pagina in modo che il contenuto del div inizialmente è nascosto quando la pagina viene caricata.

Istruzioni

1

Aprire il file HTML. Precedere il div con un'intestazione che gli utenti possono fare clic per mostrare e nascondere i dati correlati.

2

Digitare la funzione JavaScript all'interno dei tag "< head >":

< script >

funzione showHideDiv(id)

{

divElement = document.getElementById(id);

if(divElement.style.display == 'none'){

divElement.style.display = '';

}else {

divElement.style.display = 'none';

}

return false;

}

< / script >

3

Digitare "onClick" all'interno del tag di intestazione div per chiamare la funzione di "showHideDiv":

< h2 onClick = "showHideDiv ('d1');" > primo Div voce < / h2 >

< div >

< p > primo Div contenuto paragrafo. </p >

< / div >

4

Digitare un ID all'interno dell'elemento Div per fornire l'accesso ad esso dallo script:

< h2 onClick = "showHideDiv ('d1');" > Primo Div intestazione < / h2 >

< div id = "d1" style = "display: none" >

< p > primo Div contenuto paragrafo. </p >

< / div >

Il parametro di "visualizzazione" è impostato su none per indicare che i dati in questo Div o l'elemento non viene visualizzato. Quando si fa clic sull'intestazione, lo script imposta venga visualizzato. Ripetere il processo per ogni Div nella pagina utilizzando un ID univoco per ciascuno.