时间戳

首页 > 解决方案 > HTML 文件似乎忽略了 javascript 文件

javascript - HTML 文件似乎忽略了 javascript 文件

问题描述

所以我按照指南从这里制作了一个简单的点击游戏，我尝试测试它，由于某种原因，数字没有增加，所以我检查了控制台，它说“clik()未定义”，当我检查文件时已加载，它只显示HTML文件。为什么不执行 JS 文件？

这是 HTML 文件：

<!DOCTYPE html>
<html>
<body>
<button onclick="clik(1)">Clik to add cliks</button>
<br />
Cliks: <span id="clik">0</span>
<br />
<script src="js/script.js"></script>
</body>
</html>

这是JS文件：

var clik = 0;
function clik(num){
    clik = clik + num
   document.getElementById("clik").innerHTML = clik;
};

请记住，这些都不是在线的，我在本地运行它。控制台正在输出

The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol.

一旦我点击按钮

TypeError: clik is not a function[Learn More]

标签： javascripthtml

解决方案

var clik = 0;
function clik(num){
    clik = clik + num
   document.getElementById("clik").innerHTML = clik;
};

解析这段代码时，有一个名为 clik 的“变量”，而 i 是一个函数

第一次运行此代码

clik = clik + num;

现在clik不是函数

实际上，它比这更复杂 - 函数定义被提升到范围的顶部，所以实际发生的var clik=0是在函数第一次运行之前替换函数。你的代码相当于写

function clik(num){
    clik = clik + num
   document.getElementById("clik").innerHTML = clik;
};
var clik = 0;

现在，您可以看到为什么clik即使是第一次用户点击也不是一个功能

您的代码应该使用不同的名称var- 比如，说nclik

var nclik = 0;
function clik(num){
    nclik = nclik + num;
   document.getElementById("clik").innerHTML = nclik;
}

作为旁注，请注意我在哪里使用和没有使用 a;之后不需要一个，function {};并且您应该在每个语句之后放置一个（当然，这是一个风格问题，只是把它放在那里）

推荐阅读