rimuovere elementi da una pagina

**david666** · 27-11-2013, 17:03

ciao a tutti ho creato una funzione che al click sul pulsante aggiunge dei div tramite il metodo appendChild ma ho un problema se tramite un altro bottone voglio rimuoverli come posso fare?

**KillerWorm** · 27-11-2013, 23:18

Ciao,
la tua domanda non è troppo specifica. Cosa intendi rimuovere?... l'ultimo elemento, tutti gli elementi, un elemento in particolare?
Ad ogni modo potresti usare la funzione removeChild.

Un esempio pratico:

codice:

<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script type="text/javascript">
      var listaElementi = [];// Array degli elementi aggiunti
      // Aggiunge un nuovo elemento
      function aggiungi(){
        var nuovoElemento = document.createElement("div");
        listaElementi.push(nuovoElemento);
        nuovoElemento.innerHTML = "DIV"+ listaElementi.length;
        document.getElementById("contenitoreElementi").appendChild(nuovoElemento);
      }
      // Rimuove l'ultimo elemento della lista
      function rimuovi(){
        if(listaElementi.length) document.getElementById("contenitoreElementi").removeChild(listaElementi.pop())
      }
      
    </script> 
  </head>
  <body>
    <button type="button" onclick="aggiungi()">AGGIUNI</button> 
    <button type="button" onclick="rimuovi()">RIMUOVI</button> 
    <div id="contenitoreElementi"></div>
  </body>
</html>

**david666** · 28-11-2013, 16:06

ciao intanto grazie x la risposta utilissima

ma hai ragione non mi sono speigato bene io vorrei togliere tutti quelli che ho creato in una volta sola ora non ho potuto provare il tuo codice metto quello che ho provato fare io

function start() {
campo=document.getElementById('campo');
var div=document.createElement('div');
var num=Math.floor(Math.random()*numeri.length);
div.className="normal";
div.style.display="block";
div.innerHTML=numeri[num];
var img=document.createElement('img');
img.className="picc";
img.src=carte[num];
div.appendChild(img);
campo.appendChild(div);
}
cosi li aggiungo x rimuoverli avevo pensato

function togli() {
var element=campo.childNodes.length-1;
var child=document.getElementsByTagName('div')[1];
var id=null;
if( element > 0 ) {
child.parentNode.removeChild(child);
id=setTimeout(conta,400);
}
else {
clearTimeout(id);
element=0;
}
}
ora magari non è il modo migliore sono alle prime armi ma funziona però vorrei capire al posto di usare timeout come usare un ciclo per rimuoverli tutti spero di essermi spiegato e grazie x la pazienza

**KillerWorm** · 29-11-2013, 00:49

Ciao,
per creare un ciclo puoi usare "for" o "while" o altre cose simili. Non capisco per quale motivo hai pensato di usare Timeout in questo caso.

Per rimuovere in blocco tutti gli elementi figli ci sono diversi metodi.

Un modo veloce è l'uso di innerHTML in questo modo:

codice:

var contenitore = document.getElementById("elementoPadre");
contenitore.innerHTML = "";

Usando un ciclo, invece, potresti avere una cosa del genere:

codice:

var contenitore = document.getElementById("elementoPadre");
while (contenitore.firstChild) {
  contenitore.removeChild(contenitore.firstChild);
}

Se fai qualche googleata su questo argomento troverai degli esempi simili.

PS: quando si posta del codice sul forum è opportuno utilizzare i relativi tag di formattazione [ code ] o [ php ].

Discussione: rimuovere elementi da una pagina

Strumenti discussione

Ricerca discussione

Visualizza

rimuovere elementi da una pagina

Permessi di invio