📌  相关文章
📜  如何在 html 中包含 js (1)

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

如何在 HTML 中包含 JS

在 HTML 文件中包含 JavaScript 代码是非常常见的操作。通过使用 script 标签，我们可以将 JS 代码嵌入到 HTML 页面中，实现页面交互、动态效果和数据操作。

在 HTML 中包含 JS 的方法
1. 使用 script 标签

在 HTML 文件中引入 JS 文件最常见的方式是使用 script 标签。可以将 script 标签放在 HTML 文件的 head 或 body 标签中，如下所示：

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

或者

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

其中，src 属性引用的是你的 JS 文件。如果你想在标签中编写 JS 代码，也可以这样做：

<script>
  // 这里写你的 JS 代码
</script>
2. 将 JS 代码嵌入 HTML 元素中

另一种在 HTML 文件中包含 JS 代码的方式是将 JS 代码嵌入到 HTML 元素中。这可以使用 script 标签中的 type 属性值为 text/javascript，

<div onclick="alert('hello world')">Click me</div>
3. 使用 HTML5 新特性

HTML5 中提供了一种新的方式：<script> 标签中的 defer 和 async 属性。defer 属性规定一段脚本会被延迟到整个页面都被解析和显示完毕后再执行，而 async 属性规定一段脚本会被异步加载。

<head>
  <script src="yourscript.js" defer></script>
</head>

或者

<head>
  <script src="yourscript.js" async></script>
</head>
经验提示
  • 将 JS 文件放在 body 标签底部，可以加快页面加载速度；
  • 将 JS 代码尽可能压缩，可以节省带宽和加速加载速度；
  • 小心使用 eval()，这可能导致安全漏洞。

以上就是如何在 HTML 中包含 JS 的方法，希望对您有所帮助。