如何检查是否加载了jQuery

在开发Web应用程序时，jQuery是一个非常有用的库，但当出现错误时，有时候需要检查是否已成功加载jQuery。以下是几种方法。

1. 检查控制台错误

如果jQuery没有成功加载，则浏览器的控制台会显示一个错误。在浏览器的开发工具中打开控制台，检查是否有任何与jQuery相关的错误。例如，在Chrome DevTools中，您可以按F12打开控制台，然后单击“控制台”选项卡。

Uncaught ReferenceError: $ is not defined

如果存在此类错误，则说明未成功加载jQuery。检查HTML代码中是否有正确的路径加载jQuery文件。

2. 检查全局$或jQuery对象

如果你在控制台中输入$或jQuery，它应该返回一个函数。

typeof $    // function
typeof jQuery   // function

如果函数未定义，则说明jQuery没有成功加载。如果定义了这些函数，则意味着jQuery已成功加载。

3. 检查jQuery版本

如果您的应用程序需要一个特定的jQuery版本，则确保您正在加载正确的版本。在控制台中，您可以输入以下代码：

jQuery.fn.jquery // "3.5.1" (jQuery版本号)

如果结果不是预期的版本号，则说明您加载的jQuery版本不正确。

4. 检查脚本的状态

你可以使用document.readyState检查脚本的加载状态。在JavaScript中，readyState有四种状态：

• "loading"：文档仍在加载
• "interactive"：文档已经完成加载，文档仍在解析
• "complete"：文档和所有子资源已完成加载。
• "uninitialized"：未初始化

您可以使用以下代码：

if (document.readyState !== 'loading') {
    console.log('DOMContentLoaded has already fired');   
} else {
    document.addEventListener('DOMContentLoaded', function() {
        console.log('DOMContentLoaded has fired');
    });
}

如果文档已经完成加载，但jQuery仍未加载，则说明jQuery加载失败。

5. 使用jQuery的ready事件

通常，在检查jQuery是否加载时，我们只需要确保在文档准备就绪后进行操作。在jQuery中，您可以使用ready()事件来执行此操作。

$(document).ready(function() {
    // 您在此处执行的操作
});

如果jQuery没有加载，上面的代码将无法执行。此时您需要检查HTML代码是否存在正确的路径，以加载jQuery文件。

以上是检查是否已经加载jQuery的几种方法。如果jQuery未成功加载，则需要检查HTML代码中是否有正确的路径，以加载jQuery文件。

参考

• Checking if jQuery is loaded
• document.readyState