📅 最后修改于: 2023-12-03 14:59:54.959000 🧑 作者: Mango
在 HTML 文件中，我们可以通过以下步骤来调用 JavaScript 文件:
建立一个 .js 文件，将需要运行的 JavaScript 代码写入该文件中。
在 HTML 文件中使用 <script> 标签来调用该 .js 文件。
首先，我们需要创建一个 JavaScript 文件来写入需要运行的代码。你可以在你的项目中创建一个名为 script.js 的文件或者根据你的需求来命名它。
// script.js 文件内容
function hello() {
console.log('Hello, world!');
}
有两种方法可以在 HTML 文件中调用 JavaScript 文件：内联方式和外部文件方式。
内联方式是指直接在 HTML 文件中嵌入 JavaScript 代码，这种方式的主要适用于小的 JavaScript 代码块。
在 HTML 文件中使用 <script> 标签，并将 JavaScript 代码写入该标签中。如下：
<!DOCTYPE html>
<html>
<head>
<title>内联方式 - Hello, World!</title>
</head>
<body>
<h1>Hello, World!</h1>
<script>
function hello() {
console.log('Hello, world!');
}
hello(); // 调用函数
</script>
</body>
</html>
外部文件方式是指将 JavaScript 代码放入一个单独的 .js 文件中，然后通过在 HTML 文件中使用 <script> 标签中的 src 属性来调用该文件。
创建一个名为 script.js 的 JavaScript 文件，将需要运行的代码写进该文件中。
在 HTML 文件中使用 <script> 标签，并在 src 属性中指定 .js 文件的路径。
<!DOCTYPE html>
<html>
<head>
<title>外部文件方式 - Hello, World!</title>
<script src="script.js"></script> <!-- 调用 script.js 文件 -->
</head>
<body>
<h1>Hello, World!</h1>
<script>
hello(); // 调用函数
</script>
</body>
</html>
以上就是在 HTML 文件中调用 JavaScript 文件的方法。使用外部文件方式可以使我们的代码更加整洁和易于管理，同时允许我们利用缓存来提高网站加载速度。