Suppression de nœuds enfants créés dynamiquement à partir d'un formulaire avec js/jQuery?

Question

Le message ci-dessous a été extrêmement utile pour ce que je suis en train de faire: Builing a cart with multiple items and the PayPal button in PHP

Cette partie fonctionne à merveille:

var inp1 = document.createElement("input"); 
    inp1.setAttribute("type", "hidden"); 
    inp1.setAttribute("id", "item_number_" + current_item); 
    inp1.setAttribute("name", "item_number_" + current_item); 
    inp1.setAttribute("value", current_item); 

    document.getElementById("paypal-form").appendChild(inp1); 

mais je deviens un peu coincé sur la façon de supprimer un élément lorsque nécessaire ... Je cherche quelque chose comme:

document.getElementById('payPalForm').removeChild(inp1); 

Mais évidemment, je besoin d'un moyen de spécifier/suivre les dynamiques créées de ... ou est-il un moyen plus facile id me manque?

Toute aide serait appréciée.

Answer 1

utiliser la propriété parentNode pour récupérer l'élément parent d'un élément, et utiliser la méthode removeChild du parent:

inp1.parentNode.removeChild (inp1); 

Référence: parentNode property

Answer 2

Je ne sais pas où ce code appartient , mais il serait utile de l'encapsuler dans une classe.

function NewClass() { 
    var formPP = document.getElementById('payPalForm'); 
    var lInputs = []; 
    this.addItem = function(val) { 
     var inp1 = document.createElement("input"); 
     inp1.setAttribute("type", "hidden"); 
     inp1.setAttribute("id", "item_number_" + val); 
     inp1.setAttribute("name", "item_number_" + val); 
     inp1.setAttribute("value", val); 
     formPP.appendChild(inp1); 
     lInputs.push(inp1); 
    } 
    this.removeItem = function(val) { 
     var e = formPP.firstChild; 
     while(e) { 
      var eNext = e.nextSibling; 
      if(e.value == val) 
       formPP.removeChild(e); 
      e = eNext; 
     } 
    } 
} 

Vous devrez l'adapter pour répondre à vos besoins, mais j'espère que cela vous donnera un début.