📌  相关文章
📜  如何在html中连接一个js文件(1)

📅  最后修改于: 2023-12-03 15:24:29.977000             🧑  作者: Mango

如何在HTML中连接一个JS文件

在Web开发中，JavaScript是一个非常重要的语言。而在HTML中连接一个JS文件，则是我们平时开发中必须掌握的基本技能。下面，我们将通过以下步骤，一步一步学习如何在HTML中连接一个JS文件。

步骤

1.创建一个HTML文件

首先，我们需要创建一个HTML文件。在你常用的代码编辑器或IDE（如VSCode或Sublime Text）中新建一个文件，命名为index.html。

2.新建JS文件

在同一目录下，新建一个JS文件。命名为script.js。

3.向JS文件中添加代码

示例代码：

function greet() {
  console.log("Hello, World!");
}

greet();

4.在HTML文件中添加script标签

我们需要在HTML文件中使用script标签引入script.js文件。在head或者body标签中添加如下代码：

<script src="script.js"></script>

5.在浏览器中运行

最后一步，我们需要在浏览器中运行我们的代码。打开刚刚创建的index.html文件，浏览器将自动加载和运行script.js文件中的代码。

示例

index.html文件代码如下：

<!DOCTYPE html>
<html>
  <head>
    <title>My HTML Page</title>
  </head>
  <body>
    <h1>Hello, World!</h1>
    <script src="script.js"></script>
  </body>
</html>

script.js文件代码如下：

function greet() {
  console.log("Hello, World!");
}

greet();

以上代码将在页面中输出Hello, World!。

结论

连接js文件非常简单，只需使用script标签中的src属性引入js文件即可。使用这种方法可以帮助我们保持HTML文件的简洁和可读性，并将JavaScript代码保留在单独的文件中，以便于管理和维护。