如何在 JavaScript 中引用外部 JS 文件110

在 JavaScript 中引用外部 JS 文件是一种常见的做法，它可以帮助您将代码组织到不同的文件，并根据需要加载和重用它们。

要引用外部 JS 文件，您可以使用 script 元素的 src 属性：
```html

```
该属性的值应该指向您要加载的 JS 文件的路径，相对于当前 HTML 文件。

例如，如果您有一个名为 的外部 JS 文件，您可以使用以下代码将其引用到 HTML 文件中：
```html

```

所引用的 JS 文件将被浏览器异步加载和执行。如果您需要确保脚本在页面加载完成之前执行，可以使用 defer 属性：
```html

```

或者，如果您需要确保脚本按特定顺序执行，可以使用 async 属性异步加载脚本，但仍按顺序执行：
```html


```

引用外部 JS 文件时，您还可以使用 JavaScript 的 import 语句，它提供了一种更现代且结构化的方式来导入模块：
```javascript
import { functionName } from 'path/to/';
```
该语句将从指定的模块导入 functionName 函数。

import 语句的一个好处是，它允许您使用模块的 export 语句来控制哪些符号可以从模块外部访问。您还可以指定多个符号，如下所示：
```javascript
import { functionName1, functionName2 } from 'path/to/';
```

另一个选择是使用 fetch() 函数动态加载 JS 文件：
```javascript
fetch('path/to/')
.then(response => ())
.then(script => {
const scriptElement = ('script');
= script;
(scriptElement);
});
```
该代码会异步获取外部 JS 文件的内容，然后将该内容添加到 DOM 中作为 script 元素。

总结一下，引用外部 JS 文件有多种方法，具体方法取决于您的特定需求。script 元素的 src 属性是传统方法，而 import 语句和 fetch() 函数提供了更现代的替代方法。

2025-01-24

上一篇：JavaScript 函数类型

下一篇：浏览器端的本地调用：JavaScript的神奇力量