檢查父容器的兒童javascript

只是想知道如何檢查元素（即按鈕）的元素（即div容器），如果它們存在，刪除它們？檢查父容器的兒童javascript

如果我將一個孩子附加到一個div上，我怎麼能在下一次看起來檢查那個孩子或那些類型的孩子？即加入;

example = document.getElementById('div'); 
example.appendChild(aButton); 

//loop to look for aButton/button type in example div

乾杯

來源

2011-08-18 myol

完全相同的副本http://stackoverflow.com/questions/2161634/how-to-check-if-element-has -any-children-in-javascript – Saul

你是否反對使用JavaScript框架如jQuery？他們傾向於使這種任務更簡單。 –

@Saul檢查一般的孩子，檢查 - 然後去除 - 特定類型的孩子並不是一回事。 –

獲取的childNodes數組，遍歷，尋找一個符合您的條件（輸入標籤用類型的按鈕，或者可能是一個按鈕標籤）

var children = example.childNodes; 

for(var i = 0; i<children.length; i++){ 
    if(children[i].tagName == "INPUT" && children[i].type=='button') { 
     example.removeChild(children[i]); 
     i--; //Decrement counter since we are removing an item from the list 
    } 
}

實施例：http://jsfiddle.net/BZMbk/3/

來源

2011-08-18 15:13:06 Dennis

我得到了這個工作。我個人遇到的問題是，隨着我遞增，容器的大小隨着我移除孩子而變小，因此每次都會移除大約一半的按鈕。魔術1只是第一個附加的我不想碰的其他子元素。 \t 'var children = buttonContainer.childNodes; \t var childrenLength = children。長度 - 1; \t \t 爲（VAR I = 0; I myol

@ r34ch當你想要移除元素的數組迭代時，訣竅是向後移動，所以你從最後一個元素開始，朝向第一個元素。元素索引（按列表中的順序）您刪除的元素索引將會改變，但由於您已經對這些元素進行了迭代，所以這不是問題。 –

@Anthony未來我會記得。我今天在常識方面很短暫.. – myol

你可以使用children，然後遍歷孩子。例如，如果您有以下設置一個div：

<div id='div'> 
    <input type='button'> 
    <p>here</p> 
    <a href="#"></a> 
</div>

然後，您可以讓孩子一個循環通過他們這樣的：

var example = document.getElementById("div"); 
var children = example.children; 
alert(children.length); 
for(var i = 0; i < children.length; i++) 
{ 
    alert(children[i].tagName); 
}

而且，以消除他們來說，這將是一樣簡單作爲

example.removeChild(children[i]);

來源

2011-08-18 15:07:20 scrappedcola

這很好地工作，除了它發現不是按鈕的孩子，也刪除了那個孩子，這也是我想要避免的 – myol

你仍然需要在if（children [i] .tagName =='input' && children [i] .type ==「button」）或任何你想要刪除的元素 – scrappedcola

若要取得從文檔的子集的節點類型的元素，你可以簡單地做

document.getElementById('div').getElementsByTagName("button")

這將返回任何按鈕的元素與「格」（不是一個好名字的ID BTW）的ID

來源

2011-08-18 15:08:33

檢查父容器的兒童javascript

回答

相關問題