Получите parentNode отмеченных элементов флажка

Question

Hoe Я пытаюсь использовать querySelectorAll для выбора всех родительских элементов, у которых установлен их дочерний флажок.

В основном HTML является

<div id=""><input type="checkbox" value="test"></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") 

Это будет выбрать все элементы div с input:checked.

Подробнее здесь: CSS Selectors Reference

Answer 3

проблема у вас есть то, что

document.querySelectorAll("input:checked"); 

возвращает массив элементов, поэтому селектор

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

недействителен, вы пытаетесь выполнить «ParentNode» в массиве

вы должны сначала получить проверенные элементы (document.querySelectorAll("input:checked");), а затем сделать петлю Еогеасп на нем, чтобы получить родительский узел и идентификатор.

надеюсь, что это поможет