JavaScript 是一种广泛应用于 Web 开发的脚本语言，它可以在 HTML 文档中以多种方式运行。本文将详细介绍 JavaScript 的三种运行方式，并通过代码示例和常见问题解答帮助开发者快速掌握核心知识点。
一、JavaScript运行的三种方式
1. 直接嵌入 script 标签
JavaScript 代码可以直接嵌入到 HTML 的 script 标签中。这种方式是最常见的，代码可以直接写在 HTML 文件中，位于 head 或 body 标签内。
特点：
- 代码直接写在 HTML 文件中，适合小型项目或快速测试。
- script 标签可以放在 head 或 body 中，甚至可以放在 HTML 标签外（但不推荐）。
2. 事件属性内嵌
JavaScript 代码可以嵌入到 HTML 标签的事件属性中，例如 onclick、onload 等。这种方式通过事件触发 JavaScript 代码的执行。
特点：
- 代码直接写在 HTML 标签的事件属性中，适合简单的交互逻辑。
- 常用事件属性包括 onclick、onload、onsubmit 等。
3. 外部文件引用
JavaScript 代码可以写在单独的 .js 文件中，然后通过 script 标签的 src 属性引入到 HTML 文件中。这种方式适合大型项目，便于代码管理和维护。
外部文件 myScript.js：
`javascript
function sayHello() {
alert("Welcome to JavaScript!");
}
`
HTML 文件：
`html
`
特点：
- JavaScript 代码写在单独的 .js 文件中，便于维护和复用。
- 通过 src 属性引入外部文件，适合大型项目。
二、常见问题解答（FAQ）
以下是关于 JavaScript 运行方式的常见问题和解答：
问题 答案
script 标签可以放在 HTML 的哪些位置？ script 标签可以放在 head 或 body 中，甚至可以放在 HTML 标签外（但不推荐）。
事件属性内嵌的 JavaScript 代码可以省略 javascript: 前缀吗？ 是的，可以省略 javascript: 前缀，直接写 JavaScript 代码即可。
外部文件引用时，src 属性的路径如何设置？ src 属性的路径可以是相对路径或绝对路径，例如 myScript.js 或 https://example.com/myScript.js。
type 属性和 language 属性的区别是什么？ type 属性用于指定脚本的 MIME 类型（如 text/javascript），language 属性已过时，不推荐使用。
JavaScript 字符串可以使用单引号还是双引号？ JavaScript 字符串可以使用单引号或双引号，两者效果相同。
三、相似概念对比
以下是 JavaScript 运行方式中相似概念的对比：
概念 描述 适用场景
直接嵌入 JavaScript 代码直接写在 script 标签中 适合小型项目或快速测试
事件属性内嵌 JavaScript 代码嵌入到 HTML 标签的事件属性中 适合简单的交互逻辑
外部文件引用 JavaScript 代码写在单独的 .js 文件中，通过 src 属性引入 适合大型项目，便于代码管理和维护
四、扩展内容
1. type 属性的使用
在 HTML 中，script 标签的 type 属性用于指定脚本的 MIME 类型。现代浏览器默认支持 text/javascript，因此可以省略 type 属性。
2. language 属性的过时
language 属性已过时，现代浏览器不再支持。推荐使用 type 属性指定脚本类型。
3. 外部文件的路径设置
外部文件的路径可以是相对路径或绝对路径。相对路径以当前文件为基准，绝对路径以网站根目录为基准。
五、总结
本文详细介绍了 JavaScript 运行的三种方式：直接嵌入 script 标签、事件属性内嵌以及外部文件引用。通过代码示例和常见问题解答，帮助开发者快速掌握核心知识点。同时，通过对比相似概念，加深对 JavaScript 运行方式的理解。