JavaScript：JavaScript何时评估函数，onload或何时调用函数？

JavaScript何时评估函数？是在页面加载还是函数被调用？JavaScript：JavaScript何时评估函数，onload或何时调用函数？

我之所以这么问是因为我有以下代码：

function scriptLoaded() { 
    // one of our scripts finished loading, detect which scripts are available: 
    var jQuery = window.jQuery; 
    var maps = window.google && google.maps; 

    if (maps && !requiresGmaps.called) { 
    requiresGmaps.called = true; 
    requiresGmaps(); 
    } 
    if (jQuery && !requiresJQuery.called) { 
    requiresJQuery.called = true; 
    requiresJQuery(); 
    } 
    if (maps && jQuery && !requiresBothJQueryGmaps.called) { 
    requiresBothJQueryGmaps.called = true; 
    requiresBothJQueryGmaps(); 
    } 
} 
// asynch download of script 
function addScript(url) { 
    var script = document.createElement('script'); 
    script.src = url; 
    // older IE... 
    script.onreadystatechange=function() { 
     if (this.readyState == 'complete') scriptLoaded.call(this); 
    } 
    script.onload=scriptLoaded; 

    document.getElementsByTagName('head')[0].appendChild(script); 
} 

addScript('http://google.com/gmaps.js'); 
addScript('http://jquery.com/jquery.js'); 

// define some function dependecies 
function requiresJQuery() { // create JQuery objects } 
function requiresGmaps() { // create Google Maps object, etc } 
function requiresBothJQueryGmaps() { ... }

我想要做的就是执行异步下载我的JavaScript，并在尽可能早的时间就开始执行这些脚本但是我的代码依赖于脚本被明显下载和加载的时间。

当我尝试上面的代码时，看起来我的浏览器仍然试图在我的require*函数中计算代码，甚至在这些函数被调用之前。它是否正确？还是我误解我的代码有什么问题？

来源

2010-05-11 Benj

这个问题是唯一相关的是你是明智的把你的JavaScript从你的标记到外部文件。如果你缺乏这种智慧，那么你应该期待不确定和混乱。 – 2010-05-11 16:30:54

调用函数进行评估。

例如

function test() { 
    window.foo = 'bar'; 
} 

console.log(window.foo); // => undefined 
test(); 
console.log(window.foo); // => bar

即使test是第一console.log之前创建的，window.foo不填充直到test实际上是调用。

如果您requires*功能悬挂/阻塞，那么你需要显示这些代码（你为什么不为有问题的人源？）

编辑：

目前，当您将加载的<script>附加到<head>时，您的网站正在关闭我。

无论如何，一个快速解决方法是在</body>之前将所需的脚本放在页面底部附近，因为只有在<head>中的脚本将在加载时完全阻止页面。

有一些优雅的方式来晚负荷的资源，但是，为了保持简单..

<script type="text/javascript" src="http://path/to/jquery.js"></script> 
<script type="text/javascript"> 
requiresJQuery(); // jQuery is available at this point 
</script> 
</body>

的一点是，由于<script>放置后，您的主要元素，在DOM元素会在浏览器开始下载其他库之前可用（并可能已加载）。

来源

2010-05-11 16:24:15 Matt

@Matt，我现在链接到原始文章中的活网站。查看更新。 – Benj 2010-05-11 16:32:04

@Matt，也 - 我基本上想方设法让我的网站加载速度更快，我注意到一个大的JS是阻止。你可以在/看到我的活网站。我试图做的与链接的HTML页面是重做我的首页，以删除继承JS阻塞执行较早的JS处理，如果可能的话（如果这是有道理的） – Benj 2010-05-11 16:36:08

@Benj看到我的更新 – Matt 2010-05-11 16:45:55

是的，你可能是误解。即使你的函数包含一个语法错误，直到你实际调用这个函数也没关系。

难道你是从别的地方调用这些函数吗？也许你没有提供准确的代码示例？

来源

2010-05-11 16:26:44

我现在链接到原始帖子中的活网站。查看更新。 – Benj 2010-05-11 16:32:20

我没有看到原始网站的链接。你已经把它删除了吗？ – 2010-05-11 17:13:54

JavaScript：JavaScript何时评估函数，onload或何时调用函数？

回答

相关问题