Javascript 只需单击一个按钮即可更改多列中的内容

我试图改变一个按钮点击多列，点击后的图像应该改变，标题和短语。我只能将此应用于第一列。我试着用querySelectorAll（）迭代这些列，并在其他论坛中搜索答案

也可以通过单击同一个按钮为每一列指定不同的随机图像吗？ 提前谢谢你

---

在每次迭代中，您应该通过

col

和

queryselector

引用图像/名称/短语，而不是使用变量来引用它们

btnSubmit.addEventListener('click', function(e) {
    e.preventDefault()
    row.forEach(function(col) {
        randomImage = Math.floor(Math.random() * images.length);
        col.classList.add('change');
        col.querySelector("img").src =  './images/' + images[randomImage] + '.png'; 
        col.querySelector(".name").textContent = inputName.value
        col.querySelector(".phrase").textContent = inputPhrase.value
    })
});

---

const row=document.querySelectorAll（'.column'）变量名称在这里很混乱；）正确，应该是col，我会修复它。谢谢，但我收到一个错误：app.js:26 Uncaught TypeError:无法在HtmlButtoneElement的NodeList.forEach（）的app.js:26处将属性'src'设置为null。（app.js:24）@Zoh我修好了，我在复制粘贴代码的时候被一个类引用了你的图片，但是现在修好了。谢谢，这对我很有帮助！有人知道，由于图像是从数组中随机选择的，是否可以从该按钮单击的每列中获得不同的图像吗？@Zoh我已经更新了每行随机图像的答案。@imavin2太棒了，太棒了，现在我明白了事情的机理。
btnSubmit.addEventListener('click', function(e) {
    e.preventDefault()
    row.forEach(function(col) {
        randomImage = Math.floor(Math.random() * images.length);
        col.classList.add('change');
        col.querySelector("img").src =  './images/' + images[randomImage] + '.png'; 
        col.querySelector(".name").textContent = inputName.value
        col.querySelector(".phrase").textContent = inputPhrase.value
    })
});