如何刪除一個div中的單個文本節點而不刪除所有這些節點？

我該如何去除個別動態創建的文本節點？如何刪除一個div中的單個文本節點而不刪除所有這些節點？

我正在動態生成輸入，並且正在使用.createTextNode在元素之前放置描述性文本。我需要能夠刪除正在創建的特定元素，並使用.removeChild來執行此操作。這適用於移除單個輸入，因爲我可以引用（id/name）。有沒有辦法爲每個文本節點設置某種引用，以便我可以將其與相應的輸入控件一起刪除？

var box = document.getElementById("myDiv"); 

box.appendChild(document.createTextNode('Status: ')); 
var inp = document.createElement('input'); 
inp.type = 'text'; 
// add attributes, etc... 

box.appendChild(inp);

來源

2009-12-21 Jaden

爲什麼不把它們包裝在一個字段集中呢？

var box = document.getElementById("myDiv"); 

var field = document.createElement('fieldset'); 
field.appendChild(document.createTextNode('Status: ')); 
var inp = document.createElement('input'); 
inp.type = 'text'; 
// add attributes, etc... 

field.appendChild(inp); 
box.appendChild(field);

這種方式只是刪除字段元素將同時刪除您的textnode和您的輸入。

來源

2009-12-21 21:02:48

我其實比我自己更喜歡這個答案。特別是在表單中，沒有充分的理由讓文本節點不在fieldset/label元素內。 – davidcl 2009-12-21 21:07:09

謝謝你，但我有一個問題。如何將「字段」傳遞給函數，以便我可以刪除字段集？我正在創建一個按鈕，調用一個單擊時刪除該字段的函數。但是這個按鈕是在字段本身中創建的，當我將字段傳遞給它時，字段爲空。 – Jaden 2009-12-21 22:35:48

如果改變這一行：

box.appendChild(document.createTextNode('Status: '));

要：

var textNode = document.createTextNode('Status: '); 
box.appendChild(textNode);

然後，你可以參考textNode VAR後來將其刪除。但要小心 - 一些瀏覽器會合並相鄰的文本節點。

來源

2009-12-21 20:59:17 Annie

var box = document.getElementById("myDiv"); 

var label = document.createTextNode('Status: ') 
box.appendChild(label); 
var inp = document.createElement('input'); 
inp.type = 'text'; 
// add attributes, etc... 

box.appendChild(inp); 

// do other stuff 

//remove the label 
label.nodeValue = "";

來源

2009-12-21 21:04:28 davidcl

不要刪除屬於DOM中文本節點列表的文本節點。即使你引用它們（在你將它們附加到DOM之前）。

瀏覽器可能會合並多個文本節點！我不確定標準是什麼狀態，但它可能 - 至少有一些經驗告訴我...（可能是舊的瀏覽器，但情況就是如此）。

除此之外，您可以將每個文本節點包裝在span或div標記中，也可以使用某種文本替換。我更喜歡前者。

來源

2009-12-21 21:12:17 Frunsi

保持對它的引用：

var txt = document.createTextNode('Status: '); 
box.appendChild(txt);

，然後用刪除：

txt.parentNode.removeChild(txt);

如果節點應該在輸入之前立即，這也能發揮作用：

inp.parentNode.removeChild(inp.previousSibling);

它應該工作，如果你不使用innerHTML或normalize()，其中c應該使節點重新創建或合併，使參考無效。

如果您想從節點中刪除任意文本，則有textnode.splitText(offset)。

來源

2009-12-21 21:21:00 Kornel

如何刪除一個div中的單個文本節點而不刪除所有這些節點？

回答

相關問題