Javascript don'；t更新随机元素（）

我试图在javascript中随机选择一个图像，这是可行的，但当我单击一个按钮，图像发生变化时，

randomeElement

仍然与第一次工作时一样。我正在尝试为另一次随机选举使用相同的名称进行更新，但不起作用。代码如下：

document.addEventListener('DOMContentLoaded', function() {
const catbutton=document.getElementById('catbutton')
const cubebutton=document.getElementById('cubebutton')
const image=document.getElementById('image')
var x=0
var arr= ["pr1.jpg", "pr2.jpg"]
const randomElement = arr[Math.floor(Math.random() * arr.length)];
console.log(randomElement)
image.src=(randomElement);
catbutton.onclick=function() {catfunction()};
function catfunction(){
    if (randomElement=="pr1.jpg"){
        x++;
        alert(x)
        const randomElement = arr[Math.floor(Math.random() * arr.length)];
        console.log(randomElement)
        image.src=(randomElement);
    }
    else if (randomElement=="pr2.jpg"){
        alert("Fallaste!")
    }
}
cubebutton.onclick=function() {cubefunction()};
function cubefunction(){
    if (randomElement=="pr2.jpg"){
        x++;
        alert(x)
        const randomElement = arr[Math.floor(Math.random() * arr.length)];
        console.log(randomElement)
        image.src=(randomElement);
    }
    else if (randomElement=="pr1.jpg"){
        alert("Fallaste!")
    }
}
})

在

是对具有相同名称的其他声明没有影响的

有关块范围的说明，请参见

如果删除

const

关键字，它将变为

if (randomElement=="pr1.jpg"){
    x++;
    alert(x)
    randomElement = arr[Math.floor(Math.random() * arr.length)];
    console.log(randomElement)
    image.src=(randomElement);
}

它分配给此处声明的

随机元素

：

const randomElement = arr[Math.floor(Math.random() * arr.length)];

然后您将遇到问题，因为您只能分配一次

const

声明。您应该将其更改为

let

声明，该声明允许您在按钮处理程序运行时分配新值

document.addEventListener('DOMContentLoaded', function() {
const catbutton=document.getElementById('catbutton')
const cubebutton=document.getElementById('cubebutton')
const image=document.getElementById('image')
var x=0
var arr= ["pr1.jpg", "pr2.jpg"]
let randomElement = arr[Math.floor(Math.random() * arr.length)];
console.log(randomElement)
image.src=(randomElement);
catbutton.onclick=function() {catfunction()};
function catfunction(){
    if (randomElement=="pr1.jpg"){
        x++;
        alert(x)
        randomElement = arr[Math.floor(Math.random() * arr.length)];
        console.log(randomElement)
        image.src=(randomElement);
    }
    else if (randomElement=="pr2.jpg"){
        alert("Fallaste!")
    }
}
cubebutton.onclick=function() {cubefunction()};
function cubefunction(){
    if (randomElement=="pr2.jpg"){
        x++;
        alert(x)
        randomElement = arr[Math.floor(Math.random() * arr.length)];
        console.log(randomElement)
        image.src=(randomElement);
    }
    else if (randomElement=="pr1.jpg"){
        alert("Fallaste!")
    }
}
})

---

您有三种不同的

const randomElement

声明。您希望更新哪一个？您是否希望将顶部的

const randomElement

更改为

let randomElement

，并去掉函数上的

const

，以便它们只分配给外部声明？@MikeSamuel是的，我想更改顶部的声明。顺便说一下，我是新来的javascript@MikeSamuel但我仍然不知道如何解决这个问题

const randomElement = arr[Math.floor(Math.random() * arr.length)];

document.addEventListener('DOMContentLoaded', function() {
const catbutton=document.getElementById('catbutton')
const cubebutton=document.getElementById('cubebutton')
const image=document.getElementById('image')
var x=0
var arr= ["pr1.jpg", "pr2.jpg"]
let randomElement = arr[Math.floor(Math.random() * arr.length)];
console.log(randomElement)
image.src=(randomElement);
catbutton.onclick=function() {catfunction()};
function catfunction(){
    if (randomElement=="pr1.jpg"){
        x++;
        alert(x)
        randomElement = arr[Math.floor(Math.random() * arr.length)];
        console.log(randomElement)
        image.src=(randomElement);
    }
    else if (randomElement=="pr2.jpg"){
        alert("Fallaste!")
    }
}
cubebutton.onclick=function() {cubefunction()};
function cubefunction(){
    if (randomElement=="pr2.jpg"){
        x++;
        alert(x)
        randomElement = arr[Math.floor(Math.random() * arr.length)];
        console.log(randomElement)
        image.src=(randomElement);
    }
    else if (randomElement=="pr1.jpg"){
        alert("Fallaste!")
    }
}
})