如果 CDN 不可用，如何加载本地 jQuery 文件？

在前端开发中，我们常常使用 CDN 加载 jQuery，以提高页面加载速度和减少服务器压力。但有时候 CDN 可能会不可用，导致 jQuery 加载失败。这时我们就需要使用本地文件进行加载。

加载本地 jQuery 文件方法

使用本地 jQuery 文件可以通过以下两种方式进行加载：

1. 使用 script 标签加载本地文件

在 HTML 页面中使用 script 标签即可加载本地的 jQuery 文件：

<script src="path/to/jquery.js"></script>

其中 path/to/jquery.js 是本地 jQuery 文件的路径。

2. 在 JavaScript 中动态加载本地文件

在 JavaScript 中动态加载本地 jQuery 文件的方法如下：

var script = document.createElement("script");
script.src = "path/to/jquery.js";
document.head.appendChild(script);

其中 path/to/jquery.js 是本地 jQuery 文件的路径。

如何检测 CDN 是否可用？

在实际开发中，我们可能需要检测 CDN 是否可用，以便采取相应的措施。常用的方法有以下两种：

1. 设置超时时间

使用 AJAX 或图片请求加载 CDN 中的 jQuery 文件并设置超时时间，如果超时则视为 CDN 不可用，执行加载本地文件的操作。

var xhr = new XMLHttpRequest();
xhr.open("GET", "https://cdn.qq.com/jquery.js", true);
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4) {
    if (xhr.status === 200) {
      alert("CDN 可用");
    } else {
      alert("CDN 不可用");
      // 加载本地文件的操作
    }
  }
};
xhr.timeout = 5000; // 设置超时时间为 5 秒钟
xhr.ontimeout = function() {
  alert("CDN 请求超时");
  // 加载本地文件的操作
};
xhr.send();

2. 链接可用性检测

使用链接可用性检测工具（如 LinkUp）检测 CDN 链接的可用性，如果不可用则执行加载本地文件的操作。

总结

在 CDN 不可用时，我们可以通过使用本地 jQuery 文件进行加载来保证页面的正常运作。同时，通过设置超时时间和链接可用性检测可以检测 CDN 的可用性，及时采取相应的措施。