document.createElement("script") 同步 [英] document.createElement("script") synchronously
问题描述
是否可以同步调用 .js
文件然后立即使用它?
Is it possible to call in a .js
file synchronously and then use it immediately afterward?
<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 时该怎么办.
This is simplified. In my implementation the createElement stuff is in a function. I thought about adding something to the function that could check to see if a certain variable was instantiated before returning control. But then there is still the problem of what to do when including js from another site that I have no control over.
想法?
我现在接受了最佳答案,因为它很好地解释了正在发生的事情.但是,如果有人对如何改进这一点有任何建议,我对他们持开放态度.这是我想做的一个例子.
I've accepted the best answer for now because it gives a good explanation for what's going on. But if anyone has any suggestions for how to improve this I'm open to them. Here's an example of what I'd like to do.
// Include() is a custom function to import js.
Include('my1.js');
Include('my2.js');
myFunc1('blarg');
myFunc2('bleet');
我只是不想过多地了解内部结构,而只想说:我希望使用这个模块,现在我将使用它的一些代码."
I just want to keep from having to know the internals too much and just be able to say, "I wish to use this module, and now I will use some code from it."
推荐答案
您可以创建带有onload"处理程序的 元素,该处理程序将在脚本执行完毕后调用由浏览器加载和评估.
You can create your <script>
element with an "onload" handler, and that will be called when the script has been loaded and evaluated by the browser.
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 不会在加载/评估的 标签上触发加载"事件.因此,我想接下来要做的是使用 XMLHttpRequest 获取脚本,然后自己
eval()
.(或者,我想,把文本塞进你添加的 标签中;
eval()
的执行环境受局部作用域的影响,所以它赢了不一定要做你想让它做的事情.)
edit — it's been pointed out that, true to form, IE doesn't fire a "load" event on <script>
tags being loaded/evaluated. Thus I suppose the next thing to do would be to fetch the script with an XMLHttpRequest and then eval()
it yourself. (Or, I suppose, stuff the text into a <script>
tag you add; the execution environment of eval()
is affected by the local scope, so it won't necessarily do what you want it to do.)
编辑 —截至 2013 年初,我强烈建议寻找更强大的脚本加载工具,例如 Requirejs.有很多特殊情况需要担心.对于非常简单的情况,有 yepnope,它现在内置于 Modernizr.
edit — As of early 2013, I'd strongly advise looking into a more robust script loading tool like Requirejs. There are a lot of special cases to worry about. For really simple situations, there's yepnope, which is now built into Modernizr.
这篇关于document.createElement("script") 同步的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!