如何将一个JS文件包含到另一个JS文件中

如何将一个JS文件包含到另一个JS文件中，以遵循DRY原则，避免代码重复。

可能是.js文件或此文件中包含.js文件的副本
您只能在HTML页面中包含脚本文件，而不能在其他脚本文件中包含。也就是说，您可以编写将"包含"脚本加载到同一页面的javascript：

var  imported  =  document.createElement('script');
imported.src  =  '/path/to/imported/script';
document.head.appendChild(imported);
但是，您的代码很可能依赖于"包含"脚本，在这种情况下，它可能会失败，因为浏览器将异步加载"导入"脚本。您最好的选择是简单地使用第三方库(如jquery或yui)，这可以为您解决这个问题。

//  jQuery
$.getScript('/path/to/imported/script.js',  function()
{
        //  script  is  now  loaded  and  executed.
        //  put  your  dependent  JS  here.
});
  相关讨论
我只能重复：如果使用$.getScript，第二个依赖脚本将在第一个脚本加载并执行后开始加载。它是顺序加载而不是并行加载。另外，如果有人包含了每个这样的loader.js文件，它加载了一些javascript库(比如jquery  ui)，那么就不能只加载下一个中使用该库的main.js。因此，JavaScript库的使用不会像平常那么容易。为了理解：我想用这种方式，但应该多建议一些，使之可行。
在你的第一个建议的情况下，你必须使用EDCOX1  7来级联脚本。但在这种情况下，我们仍然有同样的问题，我所描述的。
例如，如果您将使用Google  Chrome开发工具的"时间表"，您可以验证ok-soft-gmbh.com/jqgrid/iedeveloper.htm是否使用document.writeln并行加载脚本，并以相同的正确顺序执行(评估)。页面是xhtml，因此stackoverflow.com/questions/802854/&hellip；中的第一条语句也是错误的。所以没有找到原因(我可以核实)为什么把document.writeln放在中不好用。我希望有人给我寄一封。
我不同意批评document.write技术(见Vahan  Margaryan的建议)。我喜欢document.getElementsByTagName('head')[0].appendChild(...)的方式(见MattBall的建议)，但有一个重要问题：执行方式中包含的脚本的顺序。我必须在下面更准确地描述这个问题。

最近我花了很多时间来重现一个相近的问题。众所周知，jquery插件使用相同的技术(请参阅这里的src)来加载文件，但不同的人报告了这方面的工作问题。我可以这样描述这个问题。让我们为您提供由多个脚本组成的javascript库，其中一个loader.js加载所有部分。这些部分中的一些来自另一部分。让我们为每个添加另一个main.js脚本，在loader.js之后立即使用来自loader.js的对象。问题是有时，main.js在loader.js加载所有脚本之前执行。在main.js脚本内部使用$(document).ready(function  ()  {/*code  here*/});也无济于事。在loader.js中使用级联onload事件处理程序将遵循顺序而不是并行加载脚本，并且难以使用main.js脚本，该脚本应仅包含在loader.js之后的某个位置。

我可以在我的环境中重现这个问题，并且可以看到在InternetExplorer8中脚本的执行顺序可以是另一个包含javascript的顺序。如果您需要包含一些脚本(其中一个脚本依赖于另一个脚本)，这是非常困难的问题。问题和在并行加载JavaScript文件中进行了描述。由于建议使用document.writeln的解决方法：

1
2
document.writeln("");
document.writeln("");
在这种情况下，"脚本是并行下载的，但按照写入页面的顺序执行"。从document.getElementsByTagName('head')[0].appendChild(...)技术改为document.writeln技术后，我再也没有看到任何问题。

所以我建议你使用EDCOX1，15。

更新：如果有人感兴趣，他可以尝试在Internet  Explorer中加载(和重新加载)页面(页面使用document.getElementsByTagName('head')[0].appendChild(...)技术)，并与使用document.writeln的固定版本进行比较。(页面代码相对较脏，不是我写的，但可以用来重现我描述的问题)。


     返回顶部