document.createElement（“ script”）同步

一尘不染

document.createElement（“ script”）同步

javascript

是否可以.js同步调用文件，然后立即使用它？

<script type="text/javascript">
    var head = document.getElementsByTagName('head').item(0);
    var script = document.createElement('script');
    script.setAttribute('type', 'text/javascript');
    script.setAttribute('src', 'http://mysite/my.js');
    head.appendChild(script);

    myFunction(); // Fails because it hasn't loaded from my.js yet.

    window.onload = function() {
        // Works most of the time but not all of the time.
        // Especially if my.js injects another script that contains myFunction().
        myFunction();
    };
</script>

这被简化了。在我的实现中，createElement东西在一个函数中。我考虑过要在函数中添加一些内容，以检查在返回控件之前是否实例化了某个变量。但是，当包含我无法控制的另一个站点的js时，仍然存在问题。

有什么想法吗？

编辑：

我已经接受了最佳答案，因为它可以很好地说明正在发生的事情。但是，如果有人对如何改进它有任何建议，我欢迎他们。这是我想做的事的一个例子。

// Include() is a custom function to import js.
Include('my1.js');
Include('my2.js');

myFunc1('blarg');
myFunc2('bleet');

我只是想避免过多地了解内部知识，而只能说：“我希望使用此模块，现在我将使用其中的一些代码。”

阅读 1168

2020-04-25

共1个答案

一尘不染

您可以<script>使用“ onload”处理程序来创建元素，当浏览器加载并评估脚本时将调用该元素。

var script = document.createElement('script');
script.onload = function() {
  alert("Script loaded and ready");
};
script.src = "http://whatever.com/the/script.js";
document.getElementsByTagName('head')[0].appendChild(script);

您无法同步执行。

编辑
-已经指出，从形式上讲，IE不会在<script>要加载/评估的标签上触发“加载”事件。因此，我想接下来要做的是使用XMLHttpRequest来获取脚本，然后eval()自己获取。（或者，我想将文本填充到<script>您添加的标签中；的执行环境eval()受本地范围的影响，因此它不一定会执行您想要的操作。）

编辑 - 从2013年初开始
，我强烈建议您研究一个更强大的脚本加载工具，例如Requirejs。有很多特殊情况需要担心。在非常简单的情况下，可以使用yepnope，它已内置在Modernizr中。

2020-04-25