我如何使一个数字（var是f）每20秒减少5，然后实时显示这个数字？ 我正在制作一个饥饿游戏模拟器来和我的朋友们一起直播，我希望每个贡品饥饿都能为他们直播显示（所有在单独的设备上）。 我想让饥饿感每20秒减少5次。 这就是我所尝试的:
<h1>Hunger Games Tribute Status:</h1>
<button onclick="startgame()">START GAME</button>
<h5 id="hunger"></h5>
</body>
function startgame(){
var f = 200;
var intervalID = window.setInterval (foodcountdown(), 20000);
document.getElementById("hunger".innerHTML = f; }
function foodcountdown() {
var x=f-5;
var f=x; }
如果您想要共享您的f变量，您应该把它放在全局范围内
var f = 200; //moved
function startgame(){
var intervalID = window.setInterval (foodcountdown(), 20000);
document.getElementById("hunger").innerHTML = f; //corrected
}
function foodcountdown() {
f=f-5; //corrected
document.getElementById("hunger").innerHTML = f; //added
}
>
setInterval（foodcountdown，20000）；-不应该有()，您需要将函数传递给interval，让它执行它，而不是自己执行它
getElementById('hung').innerHTML-您需要在innerHTML前面加上一个.，而不是像您当前使用的；
通过在foodcountdown函数中的var f=...中使用关键字var，您正在创建一个局部变量，因此不会影响您想要的，在startgame中声明的变量。 F需要两个函数都可以访问，使其成为全局的，或者至少在相同的上层作用域中
如果要清除intervalid，还需要可以访问该intervalid
在游戏开始时，你会显示食物数量，但以后不会再显示了
下面是一个固定的演示:
null
var f, intervalID;
function startgame() {
f = 200; // Allows you to restart a game from the start
clearInterval(intervalID); // In case a game was already started
intervalID = setInterval(foodcountdown, 200); // changed to 200ms for the demo
displayFoodCount();
}
function foodcountdown() {
f -= 5;
displayFoodCount();
if (f <= 0) {
clearInterval(intervalID);
console.log('Game over!');
}
}
function displayFoodCount() {
document.getElementById("hunger").innerHTML = f;
}<h1>Hunger Games Tribute Status:</h1>
<button onclick="startgame()">START GAME</button>
<h5 id="hunger"></h5>
f声明为全局变量。setInterval，而不是函数的结果。innerHTML之前有一个；，而不是.。所以（我减小了样本的间隔）:
null
var f, intervalID;
function startgame() {
f = 200;
intervalID = window.setInterval(foodcountdown, 2000);
}
function foodcountdown() {
f = f - 5;
document.getElementById("hunger").innerHTML = f;
}<h1>Hunger Games Tribute Status:</h1>
<button onclick="startgame()">START GAME</button>
<h5 id="hunger"></h5>