对不起,如果重复的话。
由于某种原因,我的JavaScript无法运行或有效。也许是HTML。这是代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Math Facts Game</title>
<style>
h1 {text-align: center; font-size:28px;}
button {font-size:27px;}
h2 {color: green; text-align: center;}
body {text-align: center;}
</style>
</head>
<body id="body">
<h1>Welcome to</h1><a href="https://www.khanacademy.org/profile/Ethanlovessnakes/">epthesnakelover's</a><h1> math fact game!</h1>
<h2 id="loading-bar"></h2>
<br>
Range: <input id="range1"> to <input id="range2">
<br>
<br>
<button onclick="startgame()">Start</button>
<div id="loader-container">
</div>
<script>
function startgame() {
document.getElementById("body").innerHTML = "Loading";
var y = document.createElement("BR");
document.body.appendChild(y);
var x = document.createElement("IMG");
x.setAttribute("src", "https://upload.wikimedia.org/wikipedia/commons/d/de/Ajax-loader.gif");
x.setAttribute("width", "10%");
x.setAttribute("height", "10%");
x.setAttribute("alt", "Loader");
document.body.appendChild(x);
var one;
var z;
setTimeout(game, 3000)
};
function game() {
document.getElementById("body").innerHTML = "";
rangeo = document.getElementById("range1").value;
ranget = document.getElementById("range2").value;
one = Math.floor((Math.random() * ranget) + rangeo);
two = Math.floor((Math.random() * ranget) + rangeo);
document.getElementById("body").innerHTML = "What is" + one + "X" + two;
};
</script>
</body>
</html>
我不知道为什么这不能改变innerHTML。请帮忙,一切都会感激的!
谢谢!
答案 0 :(得分:1)
执行document.getElementById("range1")
时,输入消失了,因为您已经用"Loading"
替换了正文中的所有HTML。在此之前获取输入的值,或者隐藏它们而不是删除它们。