DOM innerHTML double problème

Question

function SwapPlans(city, id) { 
    var tp = GetTravelPlanById(id); 
    var content = MakeHTMLAccordionMe(tp.items[0]); 

    document.getElementById(city).innerHTML = " "; 
    document.getElementById(city).innerHTML = content.innerHTML; 
    document.getElementById(city).outerHTML = " "; 
    document.getElementById(city).outerHTML = content.outerHTML; 
} 

Salut,

J'ai un problème avec l'extrait ci-dessus. La fonction MakeAccordionME renvoie le contenu que je veux modifier par document.getElementById (city) = valeur; mais Il ne supprime pas le premier contenu de la première div.

Existe-t-il une méthode content.clear dans DOM javascript?

thx

P.S. la div qui retourne de document.getElementById (city) est un div accordéon jquery.

Answer 1

Dans DOM (tel que mis en œuvre par les navigateurs, innerHTML n'est pas standard jusqu'à HTML5, mais implémenté par tous) la définition du innerHTML d'un élément supprimera tout son contenu. La différence entre innerHTML et outerHTML est que pour outerHTML le tag lui-même est inclus. OuterHTML peut donc être utilisé pour remplacer une étiquette. Comme le contenu est de type element, vous ne voulez pas utiliser innerHTML de toute façon, vous voulez l'attacher à l'élément dom concerné.

Cela pourrait fonctionner:

function SwapPlans(city, id) { 
    var tp = GetTravelPlanById(id); 
    var content = MakeHTMLAccordionMe(tp.items[0]); 
    var city = document.getElementById(city); 

    // Remove all children of the div 
    while (city.hasChildNodes()) { 
     city.removeChild(city.children.item(0)); 
    } 

    // Add a child to the city, making sure that it belongs to this document. Instead 
    // of blind importing you might also check it's ownership. 
    city.appendChild(city.ownerDocument.importNode(content))