【html引用js的三种方法】在网页开发中，JavaScript 是实现动态效果和交互功能的重要工具。为了让 HTML 页面能够使用 JavaScript 的功能，必须将 JS 代码正确地引入到 HTML 文件中。以下是目前最常见、最实用的三种 HTML 引用 JS 的方式。
一、
在 HTML 中引入 JavaScript 主要有三种方式，每种方式适用于不同的开发场景：
1. 内联脚本（Inline Script）
将 JavaScript 代码直接写在 HTML 文件中的 `<script>` 标签内，适用于简单的页面或调试阶段。
2. 内部脚本（Internal Script）
将 JavaScript 代码保存在一个独立的 `.js` 文件中，并通过 `<script>` 标签的 `src` 属性引入当前 HTML 页面，适用于多个页面共享同一段 JS 代码的情况。
3. 外部脚本（External Script）
与内部脚本类似，但通常指的是通过网络资源（如 CDN 或服务器上的文件）加载 JavaScript，适合大型项目或需要优化加载性能的场景。
二、表格展示
| 方法类型 | 引入方式 | 优点 | 缺点 | 适用场景 |
| 内联脚本 | 直接写在 `<script>` 标签内 | 简单易用，无需额外文件 | 代码重复，维护困难 | 小型页面或临时测试 |
| 内部脚本 | 使用 `<script src="xxx.js">` | 代码复用，便于维护 | 需要额外管理 JS 文件 | 多个页面共享 JS 代码 |
| 外部脚本 | 通过 CDN 或服务器路径加载 JS 文件 | 加载速度快，利于缓存和维护 | 依赖网络环境，可能影响加载速度 | 大型项目、公共库使用 |
三、小结
无论选择哪种方式，都应根据项目的规模、性能需求以及开发习惯来决定。对于初学者来说，从内联脚本开始学习是合适的；而对于实际项目，建议采用内部或外部脚本的方式，提高代码的可维护性和复用性。合理地组织 JavaScript 代码，不仅能提升开发效率，还能增强用户体验。
