异步加载javascript文件答案

【问题标题】：Loading javascript file asynchronously异步加载javascript文件
【发布时间】：2013-12-29 06:30:05
【问题描述】：

我正在尝试通过以下方式对服务器进行异步调用

$(document).ready(function(){
    $.ajax({
    cache: true,
        async: true,
        dataType: "script",
        url:"www.xyz.com/yyy?host_name=abc.com&amp;size=S&amp;use_flash=YES&amp;use_transparent=YES&amp;lang=en",
       success: function(data) { 
            $("#verified").append(data);
                console.log("data is "+data);
                loading = false; 
            } 
       });
});

但是脚本没有被异步加载。我到底错过了什么？任何帮助将不胜感激！

【问题讨论】：

您缺少success 来从服务器检索响应！
另外，您是否看到请求发生在 Chrome/Firefox Inspector 的网络面板中？顺便说一句，您不应该对 javascript 中的特殊字符 ("&") 使用 HTML 编码。

标签： javascript ajax asynchronous

【解决方案1】：

使用以下函数异步加载javascript

 function script(url) {
        var scriptObject = document.createElement('script');
        scriptObject .type = 'text/javascript';
        scriptObject .async = true;
        scriptObject .src = url;
        document.getElementsByTagName('head')[0].appendChild(scriptObject );            
    }

【讨论】：

嘿，谢谢，我已经尝试按照您的建议加载 javascript 文件，但是它不起作用，因为在我的页面中从服务器加载脚本需要很长时间，并且只有在加载其他 .js 文件之后正在加载。知道为什么吗？

【解决方案2】：

试试jQuery.getScript函数。

【讨论】：

是的，如果你负担得起的话，它比使用平面 javascript 要好得多，它对未初始化的错误处理更容易

【解决方案3】：

ajax 调用的“cache”和“async”属性默认值为“true”，您不必再次指定默认值。

您提到加载文件需要时间，这可能是因为您尝试加载的脚本文件大小足够。充足的大小是指超过 50 或 100 kb。

要减少文件加载所需的时间，您可以缩小 js 文件，这将帮助您减小脚本的文件大小并最终在 ajax 调用时更快地加载。

http://jscompress.com 是可用的在线压缩工具之一。

或者，您可以尝试使用广泛用于异步加载脚本文件的 requirejs 库。您可以从以下链接下载 requirejs 库： http://requirejs.org/docs/download.html

【讨论】：