【B/S】引用Google或微软的CDN加载jQuery

迷南。 2022-07-24 05:06 162阅读 0赞

# 一、前言 #

前文介绍了JQuery的基础知识，下面小编给大家介绍一下引用Google或微软的CDN加载jQuery。

# 二、内容分析 #

在网页中我们经常使用jQuery库，选择使用的jQuery加载源，能有效加快网站的加载速度，目前最佳的选择就是使用Google或Microsoft提供的CDN jQuery源。

Google Ajax API CDN

[http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js][http_ajax.googleapis.com_ajax_libs_jquery_1.4.4_jquery.min.js]

Google Ajax CDN Documentation

Microsoft CDN

[http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js][http_ajax.aspnetcdn.com_ajax_jQuery_jquery-1.4.4.min.js]

[http://ajax.microsoft.com/ajax/jquery/jquery-1.4.4.min.js][http_ajax.microsoft.com_ajax_jquery_jquery-1.4.4.min.js]

Ajax CDN Announcement, Microsoft Ajax CDN Documentation

使用 Google jQuery 的CDN方法用起来也很简单，直接在网页里引用Google服务器上的相关js文件就可以了。不过，如果引用多个js，就要插入多段的script。 Google也提供了相应的办法，那就是google load。我们只需要在页面里引用一个js文件，就可以根据需要实时加载用到的js库了。

首先在页头部分加入以下这行代码：

加载jQuery，可以这样使用：

google.load("jquery","1.4.4");

# 三、加载方法 #

这样我们就从Google的最近的CDN镜像上加载了jQuery 1.4.4版的js库，接下来就可以正常写js代码了。不过，即使是Google的CDN镜像，下载也毕竟是需要时间的，万一代码库还没有下载完而浏览器已经解释到了下面的代码了怎么办？我们可以设定在js库加载完以后才开始执行js：

google.setOnLoadCallback(function(){//要执行的代码});

更多有关google jsapi的相关介绍和文档，可以参考：google AJAX 库 API

当然我们还有其他的类库可以加载,在google 类库 [http://code.google.com/intl/zh-CN/apis/libraries/devguide.html][http_code.google.com_intl_zh-CN_apis_libraries_devguide.html]

有各种各样的CDN，比如EXT Core、jQuery UI 、Dojo等等。

虽然 CDN jQuery 源相当的稳定，不过我们也不能保证其能随时访问，万一大局域网一激动，我们不就蛋疼了，所以我们还要给它另外一个选择，让它根据条件加载 jQuery，加一个备用源，如下：

也可以这样写：

document.write(unescape("%3Cscript src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'%3E%3C/script%3E"));
    !window.jQuery && document.write(unescape("%3Cscript src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js' type='text/javascript'%3E%3C/script%3E"));

然后保存到 jQuery.js 放在本地加载，文件很小，加载也快，变更版本也很方便。

其中第二个地址可以换成你本地的 jQuery 以保证链接稳定性。这样的意义是：先去加载谷歌的jquery库文件，如果加载失败那么就加载微软的 jquery 库文件。如果加载 google jquery 成功则会忽略后面的微软 jQuery 代码。

# 四、小结 #

前些日子学习JavaScript的时候发现自己学习的不踏实，很飘的感觉。现在回过头来重新学习了一下JQuery，发现JavaScript很简单，还是要多多的尝试，多多总结。加油~~~

[http_ajax.googleapis.com_ajax_libs_jquery_1.4.4_jquery.min.js]: http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js
[http_ajax.aspnetcdn.com_ajax_jQuery_jquery-1.4.4.min.js]: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js
[http_ajax.microsoft.com_ajax_jquery_jquery-1.4.4.min.js]: http://ajax.microsoft.com/ajax/jquery/jquery-1.4.4.min.js
[http_code.google.com_intl_zh-CN_apis_libraries_devguide.html]: http://code.google.com/intl/zh-CN/apis/libraries/devguide.html