DOM的innerHTML重复问题

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; 
} 

嗨，

我上面的代码片段的一个问题。 MakeAccordionME函数返回 我想通过document.getElementById（city）= value更改的内容;但它不会删除第一个div的第一个内容。

DOM javascript中有没有content.clear方法？

thx

p.s.从document.getElementById（city）返回的div是一个jQuery手风琴div。

Answer 1

在DOM中（由浏览器实现，innerHTML在HTML5之前并不是标准的，但由所有人实现）设置元素的innerHTML将删除它的所有内容。 innerHTML和outerHTML之间的区别在于，对于outerHTML，标签本身是包含在内的。 OuterHTML因此可以用来替换标签。由于内容是类型元素，您不希望使用innerHTML，所以您需要将其附加到涉及的dom元素。

这可能会实现：

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))