如何從輸入中獲取多個字符串並將它們放入同一數組中？

Question

如何從每個輸入字段中提取一個字符串並將它們放在同一數組中？

我目前擁有的代碼是這個。

 var input1 = document.querySelector('.form'); var btn = document.getElementById('btn'); var array = []; btn.addEventListener('click', function(){ array.push(input.value); console.log(array); }); 

 <div class="container mt-5"> <div class="row"> <div class="col-lg-12 text-center"> <input type="text" class="form"> </div> </div> </div> <div class="container mt-5"> <div class="row"> <div class="col-lg-12 text-center"> <input type="text" class="form"> </div> </div> </div> <button class="btn btn-primary text-center" id="btn">SUBMIT</button> 

提前致謝。

Answer 1

使用Array.from來選擇帶有querySelectorAll所有.form ，並傳遞一個映射函數，該函數從每個中提取.value ：

 const inputs = document.querySelectorAll('.form'); var btn = document.getElementById('btn'); btn.addEventListener('click', function(){ const arr = Array.from(inputs, elm => elm.value); console.log(arr); }); 

 <div class="container mt-5"> <div class="row"> <div class="col-lg-12 text-center"> <input type="text" class="form"> </div> </div> </div> <div class="container mt-5"> <div class="row"> <div class="col-lg-12 text-center"> <input type="text" class="form"> </div> </div> </div> <button class="btn btn-primary text-center" id="btn">SUBMIT</button>