javascript - 循环获取input.value

Question

我正在学习JS，有点困惑)我试图按 className 选择页面中的所有元素，在其中查找具有 type=hidden 的输入，并将输入值传递给变量。

为了更清楚，我将展示演示 html。

<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>
<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>
<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>
<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>

还有一些 JavaScript

var container = document.getElementsByClassName("demo_class");
for (var i = 0; i < container.length; i++) {
    var inputValue = container[i].querySelectorAll("input[type=hidden]");
    container[i].insertAdjacentHTML(
        'afterbegin', 
        '<a href ="' + inputValue + '">Some text</a>'
   );
}

在这段代码中，我找到了所有demo_class，在每个代码中都找到了input[type=hidden]，但我无法对这些值做任何事情..使用代码

inputValue.value 未定义。为什么？我做错了什么？

我不需要 jQuery，想学习 JavaScript。

Answer 1

你得到的不是值，而是它本身的元素。

替换

var inputValue =   container[i].querySelectorAll("input[type=hidden]");

与

var inputValue =   container[i].querySelectorAll("input[type=hidden]")[0].value;

querySelectorAll() - Returs array of results (event if it find one element)

.value - Property to set/retrive the value of specific element

请参阅此处的工作示例 - here