动态加载Javascript是一项非常强大且有用的技术。这方面的主题在本站已经讨论了不少,我也经常会在一些个人项目上使用 RequireJS和Dojo加载js。它们很强大,但有时候也会得不偿失。如果你使用的是jQuery,它里面有一个内置的方法可以用来加载单个js文 件。当你需要延迟加载一些js插件或其它类型的文件时,可以使用这个方法。下面就介绍一下如何使用它!

jQuery JavaScript

jQuery内置了一个方法可以加载单一的js文件;当加载完成后你可以在回调函数里执行后续操作。最基本的使用jQuery.getScript的方法是这样:

jQuery.getScript("/path/to/myscript.js", function(data, status, jqxhr) {/* 做一些加载完成后需要执行的事情*/   });

这个getScript方法返回一个jqxhr,你可以像下面这样用它:

jQuery.getScript("/path/to/myscript.js").done(function() {/* 耶,没有问题,这里可以干点什么 */}).fail(function() {/* 靠,马上执行挽救操作 */
});

最常见的使用jQuery.getScript的地方是延迟加载一个js插件,而且在加载完成时执行它:

jQuery.getScript("jquery.cookie.js").done(function() {jQuery.cookie("cookie_name", "value", { expires: 7 });
});

如果你需要更高级的功能,比如加载多个脚本,或加载不同类型的文件(文本文件,图片,css等),我建议你使用一个专门的JavaScript加载工具。如果是为了延迟加载一个js插件,避免每个页面都去加载,这个getScript很完美了。

缓存问题

有一个非常重要的问题,使用jQuery.getScript时,你需要用一个时间戳字符串跟在需要加载的js地址后面,防止它被缓存。但是,如果你希望这个脚本被缓存,你需要设置全局缓存变量,像下面这样:

jQuery.ajaxSetup({cache: true
});

如果你并不想使用全局缓存变量,你也可以使用jQuery.ajax,并注明dataTypescript

jQuery.ajax({url: "jquery.cookie.js",dataType: "script",cache: true
}).done(function() {jQuery.cookie("cookie_name", "value", { expires: 7 });
});

在加载脚本时一定要小心缓存问题!

原文:http://www.webhek.com/loading-scripts-jquery/

使用jQuery加载js脚本相关推荐

  1. jQuery加载js脚本

    动态加载Javascript是一项非常强大且有用的技术.这方面的主题在本站已经讨论了不少,我也经常会在一些个人项目上使用RequireJS和Dojo加载js.它们很强大,但有时候也会得不偿失.如果你使 ...

  2. 动态加载JS脚本的4种方法

    动态加载JS脚本的4种方法 2006-12-04 15:33 要实现动态加载JS脚本有4种方法: 1.直接document.write <script language="javasc ...

  3. 动态加载JS脚本【转】

    原文:http://mario-design.iteye.com/blog/147810 要实现动态加载JS脚本有4种方法: 1.直接document.write <script languag ...

  4. 实现动态加载JS脚本有4种方法

    转自:微点阅读  https://www.weidianyuedu.com 实现动态加载JS脚本有4种方法: 1.直接document.write 这里重新温习Document.write()的用法, ...

  5. 动态加载JS脚本有4种方法

    1.直接document.write <script>document.write("<script src='a.js'><\/script>" ...

  6. JQuery 加载 CSS、JS 文件

    JS 方式加载 CSS.JS 文件: //加载 css 文件 function includeCss(filename) {var head = document.getElementsByTagNa ...

  7. 网页性能优化之异步加载js文件

    一个网页的有很多地方可以进行性能优化,比较常见的一种方式就是异步加载js脚本文件.在谈异步加载之前,先来看看浏览器加载js文件的原理. 浏览器加载 JavaScript 脚本,主要通过<scri ...

  8. js插件动态加载js、css解决方案

    最近因为工作需要做了一个js自动导入的插件,一开始很天真的以为动态创建个script添加到head中就ok了,试了之后才发现了问题,就是如果同时引入了多个js文件,而且后一个文件中用到了前一个文件中的 ...

  9. 了解无阻塞加载javascript脚本技术

    偶然间看到这样一篇博客,内容很详细,概念解释的也很通俗,转过来与大家分享一下,学习学习. 原文转自:http://ghdcblog.cn/article/%E4%BA%86%E8%A7%A3%E6%9 ...

最新文章

  1. C语言之分支结构 if(一)
  2. 图论 ---- D. Multiples and Power Differences (全局lcm + 矩阵二分图)
  3. LeetCode 464 Can I Win(min-max博弈算法)
  4. 解决ubuntu的chkconfig[/sbin/insserv 无法找到路径问题]
  5. python多线程 不在main_Python多线程
  6. react学习(9)----react生命周期
  7. Linux文本转语音合成教程,〔教程〕使用TTS将文本转语音输出
  8. 中国小伙CVPR 18论文遭质疑:同行难复现,要求评议组撤稿
  9. java非阻塞io流_阻塞式和非阻塞io流初认识
  10. python scipy拟合曲线optimize.curve_fit 50例
  11. 《杀死一只知更鸟》读后感
  12. 友邦人寿发布非一线差异化发展策略,稳步加速中国市场拓展布局
  13. 厦门大学854结构力学(含结构动力学)考研参考书目
  14. 非静态成员必须与特定对象相对
  15. 《万里长江图》告诉我们:金沙江是长江的正源
  16. 职场生存法则,太精辟了!
  17. 【你好,windows】Windows 8.1 x86X64专业纯净版2020.2.5
  18. Android 精彩博客导航帖
  19. 企业大数据-之机器数据
  20. 美联储加息放缓美元大跌金价飙升

热门文章

  1. 乘方计算(信息学奥赛一本通-T1069)
  2. 信息学奥赛一本通C++语言——1128:图像模糊处理
  3. 信息学奥赛一本通C++语言——1014:与圆相关的计算
  4. 17 PP配置-生产计划-总体维护工厂参数
  5. 2 PP配置-一般设置-为工厂分配工厂日历
  6. 45 CO配置-控制-利润中心会计-维护控制范围设置
  7. 高级语言中的关键字:const用法分析
  8. 无法启动程序因为计算机中丢失礼包,Win10开机提示“计算机中丢失mfc110u.dll”的解决方法...
  9. win7系统定时删除数据的批处理命令_使用bat批处理命令清理windows7系统垃圾文件...
  10. C++:值传递、指针传递、引用传递