JavaScript CDN引入失败解决办法

有时候我们通过cdn引入jquery,但是难免会出错,怎么办?我们可以cdn和本地引入一起使用,做一个判断,当cdn引入成功的时候我们就不引入本地的jquery,如果CDN引入失败,那我们就引本地的jquery。

只需要把相应的jquery引入地址修改就好了其余的地方不需要做任何修改。

话不多说看代码:

第一种方法

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		
		<!-- CDN引入 -->
		<script src="https://www.jq22.com/jquery/jquery-3.3.1.j"></script>
	</head>
	<body>
		
	</body>
	<!-- 当CDN引入失败的时候指向这段代码 -->
	<script type="text/javascript">
	 if (typeof jQuery == 'undefined') {
     
     
	 document.write(unescape("%3Cscript src='../js/jQuery_js.js' type='text/javascript'%3E%3C/script%3E"));
	 }
	</script>
	
</html>

我们在document.write方法中直接使用了URL编码,把“<”编码为“%3C”,接着我们再使用unescape()方法把字符串还原过来。

我们通过unescape()方法把字符串转换回来,我们可以看到输出是一个正常的脚本引用代码。

现在,我们有一个疑问就是“为什么不使用常规字符,而是要使用字符编码呢?”,其实这是有原因的,这意味着我们代码将可以在XML、XHTML或HTML中正常运行,而无需把代码包含在CDATA(标签)中。

第二种方法

<!-- CDN引入 -->
<script src="https://www.jq22.com/jquery/jquery-3.3.1.j"></script>
		<!-- 本地引入 -->
<script>window.jQuery || document.write(unescape("%3Cscript src='../js/jQuery_js.js' type='text/javascript'%3E%3C/script%3E"))</script>

上面这种跟第一种原理是一样的,就是通过 || 运算符,如果window.jQuery为false则加载本地的jquery库。

猜你喜欢

转载自blog.csdn.net/m0_46188681/article/details/108897638