Javascript QuerySelector将从多个输入中获取多个值

我正在制作一个网站，我想使用多个输入

<input type="text" class="foo" value="foo">
<input type="text" class="foo" value="foo">
<input type="text" class="foo" value="foo">
...

<button onclick="function()">Send</button>

这只适用于我不使用值但得到完整元素而不是值的情况

谢谢：）

返回一个（非活动），而不是数组。幸运的是，可以

调用
伪数组上的数组方法：

function getValues(selector) {
    var els = document.querySelectorAll(selector);
    return [].map.call(els, el => el.value);
}

您需要单独访问这些值。
以下是更新后的代码示例：

function myfunc() {
   var myElementArray = document.querySelectorAll('.foo');

     var myOutputText = "";
     for(var i=0;i< myElementArray.length; i++){
            myOutputText += myElementArray[i].value + " | ";
    }

    alert(myOutputText);
}

函数myfunc（）{
var myElementArray=document.querySelectorAll（'.foo'）；
var myOutputText=“”；
for（var i=0；i

文档。queryselectoral（'.foo'）
将返回节点列表。因此，您的代码将返回
未定义的

其中一种方法是，您可以获取值数组


函数func（）{
var a=document.querySelectorAll（'.foo'）；
var b=[]；
对于使用ES6的（var i=0；i），要获得一个值数组，可以尝试以下方法

Array.from(document.querySelectorAll('.foo')).map(x => x.value)

document.querySelectorAll（'.foo'）
将返回nodeList.So
document.querySelectorAll（'.foo'））.value
未定义。
function
在javascript中是一个保留关键字。@SankarRaj它返回一个
NodeList
，而不是一个真正的数组。@Alnitak感谢您提供的信息。@Quentin重复问题中没有一个答案专门针对qSA及其返回的
NodeList
。forEach
与
push
结合使用>是一种典型的反模式（尽管
NodeList
接口确实提供
.forEach
，但不直接支持
.map
）@Alnitak你能解释一下吗？对不起，我不明白接受一个数组并通过一个变异函数传递每个元素，返回一个新的结果数组的标准方法是
array.prototype.map
@Alnitak得到了它。谢谢如果我要做一个if语句，比如
if（b==[，“foo”，“foo”]）{console.log（“true”）}else{console.log（“false”）}
我会得到false。为什么？以及如何实现它？我在自己的回答中考虑过这样做，但它不必要地创建了一个全新的数组，只会再次丢弃它。使用
[].map.call
可以避免这一步。
Array.from(document.querySelectorAll('.foo')).map(x => x.value)