如何使用CDN加载jQuery？对应引入代码的作用是什么？

你提供的代码作用 #

这段代码的作用是从谷歌公共CDN节点加载3.6.0版本的压缩版jQuery库，功能和你之前引入本地jQuery文件完全一致，唯一区别是资源来源于远程公共服务器，不需要你将jQuery文件存放在自身项目的本地目录中。

CDN引入jQuery的具体操作方法 #

• 将你给出的<script>标签插入到你的HTML页面中，必须放在所有依赖jQuery的自定义JS代码之前，否则会出现$ is not defined的报错。你可以选择把该标签放在<head>标签内，也可以放在页面末尾</body>闭合标签之前，放在后者可以避免jQuery下载过程阻塞页面DOM的首次渲染，提升页面打开速度。
• 引入完成后你就可以正常书写jQuery相关代码，和之前使用本地jQuery的写法没有任何区别，不需要做额外适配。

CDN引入jQuery的优势 #

• 加载速度更快：公共CDN的节点覆盖范围广，访问延迟更低；如果用户之前访问过其他使用同版本同CDN jQuery的站点，浏览器已经存在对应缓存，不需要重新下载资源，加载速度会更快。
• 节省自身服务器带宽：jQuery资源不需要从你的服务器输出，可以降低自身服务器的带宽消耗和负载压力。
• 版本切换更便捷：需要切换jQuery版本时，只需要修改src属性中的版本号即可，不需要重新下载文件替换本地资源。

注意事项 #

• 你给出的是谷歌的CDN地址，国内部分地区访问可能不稳定，你可以自行更换为国内可用的公共CDN源。
• 为了避免CDN节点故障导致jQuery加载失败，你可以增加降级处理逻辑，CDN加载失败时自动回退加载本地jQuery文件，示例代码如下：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
// CDN加载失败时加载本地jQuery
window.jQuery || document.write('<script src="./你的本地jQuery存放路径/jquery-3.6.0.min.js"><\/script>')
</script>

内容的提问来源于stack exchange，提问作者mm4096