jQuery Alternate Source in HTML
来源:互联网 发布:deepin qq for ubuntu 编辑:程序博客网 时间:2024/06/11 03:46
For better site performance, we may use popular libraries from CDN like Google Hosted Libraries.
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
That's good. But sometimes, a storm may arise from a clear sky, the script may not be accessible. To save against a rainy day, an alternative source should be ready.
<script name="jQuery" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js" data-alt-src="//code.jquery.com/jquery-2.1.3.min.js"></script>
and with the following snippet, got it.
<script title="script-alt 1.0">if(!window.jQuery){ document.write('<script name="jQueryAlt" src="'+document.scripts.namedItem("jQuery").getAttribute("data-alt-src")+'"><'+'/script>');}</script>
Note that if you want to use jQuery API directly, use document.write()
rather than appendChild call like document.body.appendChild()
to add a script element to document. for the appendChild call, its related loading is asynchronous in Chrome.
To replace the error script element with alternative script element when jQuery loading failed, this works:
<script title="script-alt 1.1">(function(){ if(!window.jQuery){ var script=document.scripts.namedItem("jQuery"); document.write('<script name="jQueryAlt" src="'+script.getAttribute("data-alt-src")+'"><'+'/script>'); script.parentElement.replaceChild(document.scripts.namedItem("jQueryAlt"),script); }}());</script>
To let the alternative script element not be tagged with "jQueryAlt", one solution:
<script title="script-alt 1.2">(function(){ if(!window.jQuery){ var script=document.scripts.namedItem("jQuery"); script.src=script.getAttribute("data-alt-src"); document.write(script.outerHTML); var lastItem=function(){return this.item(this.length-1);}; script.parentElement.replaceChild(lastItem.call(document.scripts),script); }}());</script>
To make it modular, we got
<script title="script-alt 1.3">(function(){ function lastItem(){ return this.item(this.length-1); } function setSrc(src){ this.src=src; if(document.readyState=="complete"){this.outerHTML=this.outerHTML;return;} document.write(script.outerHTML); this.parentElement.replaceChild(lastItem.call(document.scripts),script); } if(!window.jQuery){ var script=document.scripts.namedItem("jQuery"); setSrc.call(script,script.getAttribute("data-alt-src")); }}());</script>
If you have your own host with SSL support, and its resources are located at the the same path as these in Google Hosted Libraries, then the only difference between your own host and Google Hosted Libraries is host. In these circumstances, you just need to specify an alternative source host.
<script name="jQuery" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js" data-alt-host="ajax.myapis.com"></script>
and with the following script, alternative source may work.
<script title="script-alt 2.0">(function(){ function DocumentBasedURL(url){ var a=document.createElement("a"); a.href=url; return a; } function lastItem(){ return this.item(this.length-1); } function setSrc(src){ this.src=src; if(document.readyState=="complete"){this.outerHTML=this.outerHTML;return;} document.write(script.outerHTML); this.parentElement.replaceChild(lastItem.call(document.scripts),script); } if(!window.jQuery){ var script=document.scripts.namedItem("jQuery"); var url=new DocumentBasedURL(script.src); url.host=script.getAttribute("data-alt-host"); setSrc.call(script,url.href); }}());</script>
Finally, jQuery API can be called to do what you want.
<script>jQuery(function($){ console.log("jQuery "+$.fn.jquery+" loaded");});</script>
本文来自http://blog.csdn.net/flashdelover/article/details/45421109
未经允许,不准转载
- jQuery Alternate Source in HTML
- How To Create Alternate Background In WPF?
- Configuring Alternate Access Mapping in SharePoint 2010
- How to alternate Range moveStart in Firefox?
- How to: Access the HTML Source in the Managed HTML Document Object Model
- The differences between alternate port and backup port in RSTP
- Configuring Alternate Access Mapping in SharePoint 2010 using Windows PowerShell
- How to get the HTML source of a webpage in Ruby
- ubuntu-11.04-alternate-i386 source.list 更新失效后替代的source.list,基本是可以更新的
- HTML 5 Event Source
- source backup in python
- source in shell
- Wine + Source In Sight
- Source In Singht
- 155 jQuery source --1
- About Jquery Tooltip source
- PhoneGap: open source development framework for building cross-platform mobile apps, Build apps in HTML and JavaScript
- alternate keys
- 字节序:Big Endian 和 Little Endian
- 求一个数的阶乘的结果的位数
- c/c++中的const
- hadoop2.4.1集群环境搭建
- 详释(常见UITextView 输入之字数限制)之一---固定长度
- jQuery Alternate Source in HTML
- 兔子--net stop mysql或者是net start mysql出现拒绝访问错误
- 【Cocos2d-x】cocos2d-x 3.x坐标系详解
- HDU 1029Ignatius and the Princess IV 这题有点蛋疼
- CUDA在VS2010下5.5设置
- Leetcode: Permutation Sequence
- configure: error: Building GCC requires GMP 4.2+, MPFR 2.4.0+ and MPC 0.8.0+.
- frame和iframe的区别
- android中TouchEvent事件传递之普通view之间