Javascript removeChild array

Question

这看起来很简单，但我不能让它工作。我可以添加DOM元素，但在使用数组时无法删除它们。

<script language="javascript"> 
fields = 0; 
count = 0; 
function addInput() { 
    if (fields != 10) { 
     var htmlText = "<input type='search' value='' name='field[]' />"; 
     var remButton = "<input type='button' value='del' onclick='remove()' />"; 
     var newElement = document.createElement('div'); 

     newElement.id = 'SomeID'+fields; 
     newElement.innerHTML = htmlText + remButton + newElement.id; 

     var fieldsArea = document.getElementById('text'); 
     fieldsArea.appendChild(newElement); 

     fields += 1; 
    } else { 
    ... 
    } 
count++; 
} 

// NEED HELP FROM HERE PLEASE 
// You don't need to Loop, just get the button's id and remove that entire 'SomeID' 


function remove() { 
    fieldsArea = document.getElementById('text'); 


    fieldsArea.removeChild(SomeID1); <-----------------------THIS WORKS! 
    fieldsArea.removeChild(SomeID+count); <------------------THIS JUST WOULDN'T 

    count--; 
} 
</script> 

在删除功能，书写SomeID1工程和删除第一个添加的元素，但是当我尝试使用“计数”，我只是不能删除我的“元素”。

任何帮助将不胜感激。

谢谢！

Answer 1

你必须先得到元素的引用。目前，您正将一个未定义的变量SomeID传递给函数。

例如为：

var element = document.getElementById('SomeID' + fields); 
// or starting by zero: var element = document.getElementById('SomeID0'); 
element.parentNode.removeChild(element); 

如果你想删除被点击了该按钮div，你必须到相应的div的引用传递给remove功能。

'<input type="button" value="del" onclick="remove(this.parentNode)" />'; 

this将引用按钮，因为它是div的孩子，this.parentNode指div。

你也必须改变你的函数接受应删除的元素：

function remove(element) { 
    element.parentNode.removeChild(element); 
    count--; 
} 

你可能还需要更新fields，但我不知道你的代码是如何工作的。

---

如果要删除所有的人，你必须循环：

for(;fields--;) { 
    var element = document.getElementById('SomeID' + fields); 
    element.parentNode.removeChild(element); 
} 

也有看documentation of removeChild。

Answer 2

removeChild需要一个节点（DOM元素）作为参数。在这种情况下

fieldsArea.removeChild(SomeID+count); 

例如，您可以通过该节点这样

fieldsArea.removeChild(document.getElementById('SomeID'+count));