📜  如何将 javascript 文件连接到 html (1)

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

如何将 JavaScript 文件连接到 HTML

在开发Web应用时,JavaScript 文件是不可或缺的。本文将介绍如何将 JavaScript 文件连接到 HTML 中。

方法

HTML 中有两种方式将 JavaScript 文件连接到 HTML,分别是内联和外部文件。

1. 内联

内联的方式是将 JavaScript 代码直接嵌入到 HTML 的 <script> 标签中。这种方式比较适合一些简单的 JavaScript。

<!DOCTYPE html>
<html>
  <head>
    <title>内联 JavaScript</title>
  </head>
  <body>
    <script>
      function sayHello() {
        console.log('Hello World!');
      }
      sayHello();
    </script>
  </body>
</html>

上述代码中,JavaScript 代码被包括在 <script> 标签中。

2. 外部文件

将 JavaScript 代码编写在外部文件中,可以使代码更具可维护性和可读性。要将外部 JavaScript 文件连接到 HTML 中,需要使用 <script> 标签并设置 src 属性。

<!DOCTYPE html>
<html>
  <head>
    <title>外部 JavaScript</title>
    <script src="script.js"></script>
  </head>
  <body>
    <h1>Hello World!</h1>
  </body>
</html>

上述代码中,<script> 标签包含了 src 属性,该属性指定了外部 JavaScript 文件的路径。

总结

本文介绍了如何将 JavaScript 文件连接到 HTML。内联方式适用于一些简单的 JavaScript,而外部文件方式更适合于较大的 JavaScript 代码。在实践中,我们可以根据需要选择适合自己的方式。