在引入 ES6 模块之前,JavaScript 没有 import、require 或者其他功能。
2014 年,引入了 ES6 模块模块,现在可以在现代浏览器支持的 Node.js 中导入模块。
动态脚本加载
完美的解决方案是将带有脚本 URL 的脚本标记添加到 HTML 中。
<script> 标签可以添加到 <head> 或者结束 </body> 标签之前,以避免 jQuery 的开销。
function dynamicallyLoadScript(url) {
let loadScript = document.createElement("script"); //创建脚本 DOM 节点
loadScript.src = url; //将其 src 设置为提供的 URL
document.head.appendChild(loadScript);
}
AJAX 加载
可以使用 AJAX 调用和 eval 函数加载脚本。
尽管这是最直接的方法,但由于 JavaScript 沙箱安全模型,它仅限于域。
Eval 可能会导致错误和其他安全问题。
ES6 模块
Node.js v13.8.0 支持没有任何标志的 ECMAScript (ES6) 模块。
但是,包含的所有文件都必须具有 .js 扩展名:
//module.js
export function welcome() {
return "Welcome";
}
//main.js
import {
welcome
} from './module.js';
let value = welcome(); //val is "Welcome";
Node.js 需要
在 Node.js 中仍然使用 module.exports/require 系统旧的导入模块的方法。
//mymodule.js
module.exports = {
welcome: function () {
return "Welcome";
}
}
//server.js
const myModule = require('./mymodule');
let val = myModule.welcome(); //值是 "Welcome"
存在一些不需要处理的其他方式。
jQuery 加载
使用 jQuery 加载只需一行即可完成:
.getScript("script.js", function () {
alert("脚本已加载但不一定执行.");
});
日期:2020-06-02 22:16:21 来源:oir作者:oir
