我想知道是否可以.js在另一个.js文件中包含一个文件？
我想要这样做的原因是将客户包括在最低限度。我.js已经用客户端所需的函数编写了几个文件。客户端将有一个 html 文件，他/她使用.js文件包含（我的.js文件）管理该文件。
我可以重新编写一个.js包含所有函数的新文件，或者为了避免重复工作，找出一种方法来编写.js包含其他.js文件的文件。
在 .js 文件中包含 .js 文件
IT技术
javascript
2021-03-18 13:53:54
5个回答
我基本上喜欢这样，创建新元素并将其附加到 <head>
var x = document.createElement('script');
x.src = 'http://example.com/test.js';
document.getElementsByTagName("head")[0].appendChild(x);
您也可以onload对附加的每个脚本使用事件，但请对其进行测试，我不太确定它是否可以跨浏览器工作。
x.onload=callback_function;
浏览器加载时间的最佳解决方案是使用服务器端脚本将它们全部连接到一个大的 .js 文件中。确保 gzip/minify 最终版本。单一请求 - 漂亮而紧凑。
或者，您可以使用 DOM 创建<script>标签并在其上设置 src 属性，然后将其附加到<head>. 如果您需要等待该功能加载，您可以让您的 javascript 文件的其余部分从该load脚本标记上的事件中调用。
此功能基于jQuery的功能 $.getScript()
function loadScript(src, f) {
var head = document.getElementsByTagName("head")[0];
var script = document.createElement("script");
script.src = src;
var done = false;
script.onload = script.onreadystatechange = function() {
// attach to both events for cross browser finish detection:
if ( !done && (!this.readyState ||
this.readyState == "loaded" || this.readyState == "complete") ) {
done = true;
if (typeof f == 'function') f();
// cleans up a little memory:
script.onload = script.onreadystatechange = null;
head.removeChild(script);
}
};
head.appendChild(script);
}
// example:
loadScript('/some-other-script.js', function() {
alert('finished loading');
finishSetup();
});
没有直接的方法可以做到这一点。
您可以做的是按需加载脚本。（再次使用类似于 Ignacio 提到的内容，但更简洁）。
查看此链接以了解执行此操作的多种方法：http : //ajaxpatterns.org/On-Demand_Javascript
我最喜欢的是（并不总是适用）：
<script src="dojo.js" type="text/javascript">
dojo.require("dojo.aDojoPackage");
谷歌的关闭也提供了类似的功能。
我使用@gnarf 的方法，尽管我回过头document.writeln来<script>为 IE<7 标记一个标签，因为我无法让 DOM 创建在 IE6 中可靠地工作（而且 TBH 并不在意投入太多精力）。我的代码的核心是：
if (horus.script.broken) {
document.writeln('<script type="text/javascript" src="'+script+'"></script>');
horus.script.loaded(script);
} else {
var s=document.createElement('script');
s.type='text/javascript';
s.src=script;
s.async=true;
if (horus.brokenDOM){
s.onreadystatechange=
function () {
if (this.readyState=='loaded' || this.readyState=='complete'){
horus.script.loaded(script);
}
}
}else{
s.onload=function () { horus.script.loaded(script) };
}
document.head.appendChild(s);
}
其中horus.script.loaded()注意到 javascript 文件已加载，并调用任何挂起的未调用例程（由自动加载器代码保存）。