所以我有一个想法让计算机用JavaScript作为代码语言猜测数字.我确切地知道它必须做什么,但它并没有这样做.当你打开网页时,想法是(看它是否有效)获得1到100之间的随机数.奇怪的是,如果我在同一个JavaScript文件中调用该函数会产生错误,但如果我用HTML按钮调用该函数,它的工作完全正常!F12控制台出现以下错误:
无法设置未定义或空引用的属性"innerHTML"
我有以下代码:
var guessTheNumber = function() {
// var number = prompt("Tell me a number between 1 and 100.");
var x = document.getElementById("JS1");
x.innerHTML = Math.floor((Math.random() * 100) + 1);
}
guessTheNumber();<!DOCTYPE html>
<html>
<head>
<title>JS test</title>
<script type="text/javascript" src="JavaScript.js"></script>
</head>
<body>
<button onclick="guessTheNumber()"></button>
<p class="test">test</p>
<p id="JS1"></p>
</body>
</html>我尝试使用Microsoft Edge和Google Chrome作为浏览器,没有结果.我不知道我做错了什么,所以任何帮助都表示赞赏!
问题是javascript文件是在 DOM 之前加载的,因此document.getElementById("JS1");将是未定义的.
要轻松解决此问题,请加载标记<script>的BOTTOM <body>:
<!DOCTYPE html>
<html>
<head>
<title>JS test</title>
</head>
<body>
<button onclick="guessTheNumber()"></button>
<p class="test">test</p>
<p id="JS1"></p>
<script type="text/javascript" src="JavaScript.js"></script>
</body>
</html>