通过ajax加载JavaScript的好习惯方法

免责声明:我对AJAX很新!

我环顾四周,我不确定使用ajax加载javascript的方法。

我正在使用ajax来请求每个都需要自己的6-10个简短方法的页面。 总共可能有5-6个这样的页面,所以大约总共35个以上的方法。

我更愿意访问需要加载的每个页面所需的javascript。

我见过几种方法,我不确定哪种方法最符合我的需要:

  1. 在头部包含一个空脚本元素,并通过操作src属性。 DOM。

  2. 通过创建一个新的脚本元素。 DOM并将其附加到document.body(这听起来与#1相同)。

  3. jQuery(我已经在使用)有一个ajax getScript()方法。
  4. 我还没有读过任何关于它的内容,但是我可以将脚本元素作为ajax响应的一部分吗?

由于我是ajax和web开发的新手,我很好奇每种方法的起伏,以及我错过的任何方法。

一些问题是: – 是否将使用缓存副本,或者每次发出ajax请求时脚本都会下载。 请注意,脚本将是静态的。 – 浏览器兼容性。 我使用Chrome,但此应用程序将用于IE> = 7以及Firefox的各个版本。

在jQuery环境中,我使用getscript() 。 你对这个缓存感到好奇 – getscript包含一个缓存破坏function(主要用于破坏激进的IE缓存,虽然当然在其他场景中很有用)。 你可以像这样执行相当于非缓存破坏的getscript

 $.ajax({ cache: true, dataType: "script", url: "your_js_file.js", success: yourFunction }); 

由于所有其他答案只是说“使用jquery”没有任何进一步的信息/解释/理由,它可能值得实际查看你提到的其他选项。

  • 选项1

    可能有点复杂,因为它要求你等到一个脚本下载并运行之后才能获取下一个脚本(因为你只有一个脚本元素)。

  • 选项#2

    更好,因为您可以在第一个脚本元素完成下载之前将第二个脚本元素附加到DOM,而不会影响下载/执行。

  • 选项#3

    在我之前的每个人推荐,如果你在jQuery环境中并且已经加载(非常重)jQuery库用于其他用途,那就很好了 – 单独加载它显然是多余的。 值得注意的是, $.getScript()$.ajax()都使用eval()来执行脚本。 eval()在这种情况下不是“邪恶的”,因为它是一个受信任的来源,但根据我的经验,有时可能会稍微调试eval() – ed代码。

  • 第4个选项

    是不可能的afaik。

  • 选项#5

    Nick Craver在第一个OP评论中推荐的就是我要用的东西 – 如果脚本是静态的,就像你说的那样,缓存比多个HTTP请求更有效。 如果您特别关注带宽,还可以考虑使用cache.manifest进行积极的缓存: http ://www.html5rocks.com/tutorials/appcache/beginner/

使用getScript 。 它基本上与第二种方法做同样的事情,但你不必担心如何在各种浏览器(主要是IE)中监听负载。

就DOM而言,AJAX响应只是文本。 除非您以某种方式将其插入DOM,否则它无效。