Javascript 访问输入元素的嵌套路径

HTML:

这个（尽管没有jQuery）解决方案对我很有效。选中部分复选框，然后单击复选按钮

函数检查（）{
document.querySelectorAll（“.options:checked”）.forEach（el=>{
控制台日志（el.值）；
});
console.log（“--------------------------”；
}

您的名字是：

上下快速移动
大卫
杰克

.
.
.
.
这是最后一个问题


对
不

检查值

您不需要所有路径，它的最后一位就足够了。

$（'.options:checked'）

。也无需将

此

转换为jQuery对象，只需访问其JavaScript

值

属性：

函数检查（）{
$（'.options:checked'）。每个（函数（）{
console.log（this.value）；
});
}

您的名字是：

上下快速移动
大卫
杰克

. . . .
这是最后一个问题


对
不

检查

是，它工作得很好，而且更简单。感谢您不需要

数组。from（）

@RacilHilan是的，您需要

document.querySelectorAll

返回一个

节点列表

，它没有很多像

forEach

这样的数组方法，因此我必须将其转换为数组为什么不在响应之前尝试？删除

Array.from（）

，看看你的答案是否仍然有效。那么也许你可以做点什么。

NodeList

确实有

forEach

：哇。因此，它会自动遍历路径。学会了新东西。是的，我将直接使用

this.value

。谢谢，既然您已经在使用jQuery，那么这个答案就是最好的方法。如果您没有使用jQuery并且不想支持旧浏览器，那么使用

querySelectorAll（）

也是一个不错的选择。

<div id="quiz">
<div id="question">
    <p id="quiz-txt">Your Name is:</p>
    <ul id="quiz-opt">
        <div id="ans">
            <input type="checkbox" id="Bob" value="Bob" class="options">
            <label for="Bob">Bob</label>
        </div>
        <div id="ans">
            <input type="checkbox" id="David" value="David" class="options">
            <label for="David">David</label>
        </div>
        <div id="ans">
            <input type="checkbox" id="Jack" value="Jack" class="options">
            <label for="Jack">Jack</label>
        </div>
    </ul>
</div>
.
.
.
.
<div id="question">
    <p id="quiz-txt">This is the final question.</p>
    <ul id="quiz-opt">
        <div id="ans">
            <input type="checkbox" id="Yes" value="Yes" class="options">
            <label for="Yes">Yes</label>
        </div>
        <div id="ans">
            <input type="checkbox" id="No" value="No" class="options">
            <label for="No">No</label>
        </div>
    </ul>
</div>

$('#quiz').children('#question').children('#quiz-opt').children('#ans').children('.options:checked').each(function () {
    console.log($(this).val());
});