często używam następujący kod, aby usunąć zawartość elementu:Czy jest błąd w przeglądarce Internet Explorer 9/10 z innerHTML = ""?
div.innerHTML = "";
Ale znalazłem zachowanie Stange na Internet Explorer. Wygląda na to, że wszystkie dzieci w dziale otrzymują również swoje własne dzieci! Jeśli zachowam odniesienie do elementu potomnego elementu div powyżej, po wykonaniu div.innerHTML = "";
węzeł tekstu dziecka nie znajduje się już w elemencie potomnym.
Poniższy kod jest dowodem tego zachowania (http://jsfiddle.net/Laudp273/):
function createText() {
var e = document.createElement("div");
e.textContent = "Hello World!";
return e;
}
var mrk = document.createElement("div");
mrk.appendChild(createText());
mrk.style.border = "4px solid yellow";
var container = null;
function addDiv() {
if (container) {
container.innerHTML = "";
}
var e = document.createElement("div");
e.appendChild(mrk);
container = e;
document.body.appendChild(e);
}
var btn = document.createElement("button");
btn.textContent = "Add marker";
btn.addEventListener(
"click",
function() {
addDiv();
},
false
);
document.body.appendChild(btn);
Po kliknięciu na przycisk „Dodaj znacznik” dwa razy, widać pustą żółty prostokąt zamiast jednego z texte " Cześć słówka! ".
Czy błąd lub specyfikacja nie są używane przez Firefox ani Google Chrome?
zgadzam. Interpretacja Microsoft jest więcej niż niejasna. Dlatego nie używam już 'div.innerHTML =" "". Używam 'removeChild' na każdym childnode, ale nie jestem pewien, że jest to szybsze. – Tolokoban
@Tolokoban: Tak naprawdę jest. Mam gdzieś odpowiedź z testami wydajności i (ku mojemu zaskoczeniu) 'removeChild' było szybsze niż ustawienie' innerHTML' na '" ". * Edytuj *: Znaleziono: http://stackoverflow.com/a/13798847/157247 –
Połączona odpowiedź została już zaktualizowana. Ale, aby to wyjaśnić, użycie 'innerHTML' jest szybsze. –