Question

如何从CSS等其他JavaScript文件加载一个JavaScript文件？在CSS中，我们使用write @import url("mycss.css");。

有没有办法在JavaScript中实现？

Answer 1

Javascript中没有@ import-ish函数/方法，但您只需将脚本附加到<head>标记即可：

var newScript = document.createElement('script');
newScript.type = 'text/javascript';
newScript.src = '/path/to/js/file';
document.getElementsByTagName('head')[0].appendChild(newScript);

或者就像Edgar在我之前提到的那样，你可以使用jQuery。

Answer 2

是。如果您想要纯JavaScript，则必须动态创建script标记，并将其附加到文档中。

是。如果使用jQuery库，则可以使用$.getScript方法。

$.getScript("another_script.js");

Answer 3

仅仅因为没有人提到它，还有另一种选择，它不需要任何花哨的库或棘手的编码，document.write。原则上，它看起来像这样，虽然请参阅下面的警告：

document.write('<script src="myscript.js" type="text/javascript"></script>');

这将在完全解析脚本标记时执行，如果您将脚本标记放在头部，新脚本标记也将在执行正文之后立即处于头部。注意直接执行它而不是在加载文档时（如$(function(){})回调中那样。这就是我使用的：

(function(){
  function load(script) {
    document.write('<'+'script src="'+script+'" type="text/javascript"><' + '/script>');
  }

  load("script1.js");
  load("script2.js");
  load("etc.js");
})();

封闭函数就是不污染全局命名空间。

警告（以及为什么上面分解的'脚本'）脚本标记中可能没有结束脚本标记，HTML解析器不知道它是脚本的一部分。该主题有一个other question。

Answer 4

除了eval字符串的能力之外，Javascript本身不提供任何模块化帮助。但这是一个普遍的需求，大多数大型JavaScript框架已经提出了自己的解决方案，最近，已经努力在requirejs项目中标准化这些API。如果你正在使用像Dojo或jQuery这样的框架，你可能最好学会使用它们的设施，但如果没有，requirejs是一个轻量级的独立工具。你基本上只需添加

<script data-main="scripts/main" src="scripts/require.js"></script>

到你的<head>部分，然后将你自己的javascript放在这样的包装代码中（从require.js网站上窃取）：

require(["helper/util"], function() {
    //This function is called when scripts/helper/util.js is loaded.

    require.ready(function() {
        //This function is called when the page is loaded
        //(the DOMContentLoaded event) and when all required
        //scripts are loaded.

    });
});

Answer 5

使用const dataName =require('./fileName.js');

如何从另一个加载一个JavaScript文件？

5 个答案: