Come nascondere da Class in JavaScript

November 13

JavaScript è un linguaggio di programmazione per siti Web consentiti per interagire con l'utente. Esso consente di visualizzare le pagine pop-up, in modo asincrono inviare richieste al server e di creare menu a discesa, per citare alcuni esempi. Nonostante le funzioni di JavaScript per la ricerca di elementi per ID e il nome, non ha una funzione per la ricerca di elementi per classe. È possibile, tuttavia, nascondere gli elementi per classe da loop su tutti gli elementi, verificando se il loro classe corrisponde alla classe ricercati e, in caso affermativo, si nasconde l'elemento.

istruzione

1 Creare un nuovo file e salvarlo con l'estensione ".html". Aprire il file con un editor di testo, come Blocco note.

2 Scrivi un segmento di codice HTML che crea un pulsante con un attributo "onClick" di "nascondere ()." Questo chiamerà la funzione JavaScript "nascondere" quando il pulsante viene premuto. Ecco il codice:

<Button onclick = "nascondere ()"> Nascondi </ button>

3 Scrivi un segmento di codice HTML che crea un certo numero di elementi HTML con la classe "hideable." Questi elementi saranno nascosti quando il pulsante del passaggio precedente viene cliccato. Ecco un esempio:

<Div class = "hideable"> Questo è un hideable div </ div>

<Span class = "hideable"> Questo è un arco hideable </ span>

4 All'inizio del file, scrivere apertura e chiusura HTML tag "script". Questi dicono al browser che il codice al loro interno è JavaScript. Ecco il codice:

<Script>

</ Script>

5 Tra i tag "script", scrivere un JavaScript funzionare le pelli tutti gli elementi HTML con la classe "hideable." In primo luogo, essa deve avere tutti gli elementi in un array chiamando la funzione "document.getElementsByTagName" con il parametro "*" e salvare il risultato in una nuova variabile. In secondo luogo, si deve eseguire un ciclo su ogni elemento dell'array utilizzando un ciclo "for". In terzo luogo, si deve verificare se l'elemento corrente ha la classe "hideable" utilizzando il metodo "getAttribute", e, in caso affermativo, nascondere l'elemento impostando gli elementi "style.display" proprietà su "nessuno". Ecco il codice:

funzione di nascondere () {

Elementi var = document.getElementsByTagName ( "*");

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

if (elementi [i] .getAttribute ( "classe") == "hideable") {

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

}}}