时间戳

首页 > 解决方案 > html文本内容未更新

javascript - html文本内容未更新

问题描述

我正在尝试制作增量游戏。但是当我测试它时，游戏并没有增加点击次数，一切看起来都很好。那么我做错了什么？

提前致谢 ：）

JavaScript 代码（在单独的文件中）

//Unused or copied code
//  mass += energy;
//  btn.innerText = mass + "mass";
//DOM
let btn = document.getElementById("btn");
let img = document.getElementById("img");

//Variables
var mass = 0;
var energy = 1;
var version = 0.1 + 'oab';

//El(s)
img.addEventListener('click', e => {
  mass += energy;
  let btn.textContent = mass + " Mass";
});
<input type="image" id="img" src="assets/sun.jpg" name="button" alt="clicker" width="250" height="250"><br>
<h1 id='btn'>0 Mass</h1>

标签： javascripthtmlcssaddeventlistener

解决方案

无需使用 let 来分配.textContent

let btn = document.getElementById("btn");
let img = document.getElementById("img");

//Variables
var mass = 0;
var energy = 1;
var version = 0.1 + "oab";

//El(s)
img.addEventListener("click", (e) => {
  mass += energy;
  btn.textContent = mass + " Mass";
});
<input type="image" id="img" src="https://source.unsplash.com/random/" name="button" alt="clicker" width="400" height="100" />
<br />
<h1 id="btn">0 Mass</h1>

推荐阅读