獲取已選中的複選框項目的父節點

Question

鋤頭我試圖使用querySelectorAll來選擇所有具有其子複選框選中的父項目。

基本上HTML是

<div id=""><input type="checkbox" value="test"></div> 

我希望選擇有他們輸入選中複選框的div，所以這裏是我的javascript代碼

var list = querySelectorAll("input:checked.parentNode.getAttribute('id')"); 

，但是當我檢查了list.length它返回0，雖然有一些複選框已經被檢查過，但是

var list = querySelectorAll("input:checked"); 

這個工作正常。但我想要一個父項的數組。

有人可以幫助我，並告訴我爲什麼我的原始代碼不起作用？

謝謝

Answer 1

由於parentNode不可用作一個CSS選擇器，我建議你做這樣的

var list = querySelectorAll("input:checked"); 
    var parentlist = []; 
    for (var i = 0; i < list.length; i++) { 
    parentlist.push(list[i].parentNode.id); 
    } 

Answer 2

的.parentNode會工作，如果你將得到的input:checked列表並訪問parentNode。 parentNode未在CSS中定義。

使用此：

list= querySelectorAll('div>input:checked") 

這將選擇input:checked所有div元素。

查看更多在這裏： CSS Selectors Reference

Answer 3

你有問題是

document.querySelectorAll("input:checked"); 

返回一組元素，所以選擇器

var list = querySelectorAll("input:checked.parentNode.getAttribute('id')"); 

是無效的，你想在一個數組

執行「parentNode」你應該先爲選中的元素（document.querySelectorAll("input:checked");），然後做就可以了foreach循環來獲取父節點和ID。

希望這可以幫助