📌  相关文章
📜  如何检查是否加载了 jQuery 插件?

📅  最后修改于: 2022-05-13 01:55:58.887000             🧑  作者: Mango

如何检查是否加载了 jQuery 插件?

我们可以通过多种方式使用 jQuery 简单地检查 jQuery 插件是否成功加载。我们还可以检查插件中的特定函数是否可访问。本教程将演示如何检查 jQuery 插件是否已加载。

  • 第 1 步:使用 npm 安装Browsersync 。我们将使用 Browsersync 启动服务器并提供 URL 以查看 HTML 站点并使用 CDN(内容交付网络)加载jQuery 。我们将在全球安装 Browsersync。
    npm install -g browser-sync
  • 第 2 步:我们将在本教程中使用jQuery-UI插件。我们将使用 jQuery 测试此插件是否成功加载。下载此插件的最新版本并将其解压缩到您的项目根文件夹。
  • 第 3 步:创建一个index.html文件
    示例 1: jQuery 插件是 jQuery 作用域上的命名空间。 jquery-ui插件没有扩展fn命名空间,因此我们可以使用上面的代码检查插件是否加载成功。 ui表示插件的名称,可以替换为要检查的插件名称。我们在head标签中加载了 jQuery,因为它需要可用才能在应用程序中使用。建议的做法是在body标记的末尾加载所有 JavaScript 文件,以提高性能并更快地呈现页面。因此,在检查插件是否成功加载之前,我们使用了$(document).ready()函数。
    typeof运算符以字符串的形式返回其操作数的数据类型。在这种情况下,操作数是jQuery $运算符本身。
    html
    
    
    
        
        JQuery Plugin
        
    
    
        
    Hello GeeksForGeeks
             


    Javascript
    if ($.ui) {
        console.log('jquery-ui is loaded successfully')
    }


    Javascript


    Javascript
    
    


    示例 2:由于每个插件都保证有一些函数定义或值等于true ,我们可以使用代码中所示的较短版本。

    Javascript



    if ($.ui) {
        console.log('jquery-ui is loaded successfully')
    }
    

    注意:对于所有扩展fn命名空间的 jQuery 插件,正确的检查方法是:

    Javascript

    
    

    $.fn.pluginname扩展了 jQuery 对象并且是一个可在所有jQuery.init对象上调用的函数,而$.pluginname扩展了$对象本身。

  • 第 4 步:我们现在将检查插件功能是否可访问。这自动表示插件本身已成功加载。
    索引.html

    Javascript

    
    
    

    注意: jQuery函数jQuery()返回一个新的jQuery.init对象。在大多数情况下, jQuery()也可以用$()运算符替换。

  • 步骤 5:要使用 Browsersync 启动应用程序,请在项目目录中运行以下命令:
    browser-sync start --server --files "*"

    这将在服务器模式下启动 Browsersync 并监视目录中的所有文件以查看*通配符指定的更改。默认情况下,应用程序将在http://localhost:3000/ 上启动
    输出: