首页 > 解决方案 > 无法在Javascript中复制不同数组中的按钮数组

问题描述

我不明白为什么这不存储前一个数组的副本。

代码

console.log(buttons);

var copybtns = [];
for (let i = 0; i < buttons.length; i++) {
copybtns = buttons[i];
    
}

console.log(copybtns);

我在我的控制台中得到了这个 在此处输入图像描述

我枯燥的 html 代码

<body>
    <div class="container">
        <form action="">
            <select name="changecolor" id="background" onchange="changeToRed(this)">
                <option value="Random">Random</option>
                <option value="Red"">Red</option>
                <option value="Blue">Blue</option>
                <option value="Black">Black</option>
                <option value="Reset">Reset</option>
            </select>
        </form>
        <button>0</button>
        <button class="btn btn-primary">1 </button>
        <button class="btn btn-danger">2</button>
        <button class="btn btn-dark">3</button>
        <button class="btn btn-warning">4</button>
    </div>
</body>

我正在看一个教程,但写了相同的代码,但我不知道为什么它不起作用

我想要这样的结果 在此处输入图像描述

标签: javascriptarrays

解决方案


您可以简单地使用forEach函数 usingquerySelectorAll方法将按钮存储在空数组中copybtns

小提琴演示:https ://jsfiddle.net/efxwbtyu/

//get all buttons
let buttons = document.querySelectorAll('button')

//Original buttons
console.log(buttons)

//store
var copybtns = [];

//foreach
buttons.forEach((data) => copybtns.push(data))

//log the array data
console.log(copybtns);
<button>0</button>
<button class="btn btn-primary">1 </button>
<button class="btn btn-danger">2</button>
<button class="btn btn-dark">3</button>
<button class="btn btn-warning">4</button>


推荐阅读