优化WordPress：正确禁用Google CDN加载的jQuery

本教程详细阐述了如何在WordPress网站中正确移除由Google CDN加载的jQuery脚本。针对因重复加载、性能瓶颈或版本冲突导致的问题，文章指出了常见的错误尝试，并提供了使用`wp_deregister_script('jquery')`的正确方法。通过清晰的代码示例和最佳实践，指导用户有效管理WordPress中的jQuery依赖，从而提升网站性能和稳定性。

引言：WordPress中移除Google CDN jQuery的必要性

WordPress在默认情况下会加载jQuery库，有时会通过Google CDN来提供。虽然CDN加速有助于全球用户访问，但在特定情况下，这可能导致一些问题：

1. 性能瓶颈：尽管CDN通常很快，但外部资源的加载仍可能引入额外的DNS查找和HTTP请求延迟，有时甚至比本地托管的脚本慢。
2. 重复加载：如果您的主题或某些插件已经包含了另一个jQuery版本（无论是本地托管还是来自其他CDN），WordPress默认加载的Google CDN jQuery就会造成重复加载，浪费带宽并增加页面渲染时间。
3. 版本冲突：不同版本的jQuery可能存在兼容性问题，导致网站功能异常或JavaScript错误。

当您网站上已存在一个jQuery脚本，且希望避免WordPress重复加载Google CDN提供的版本时，了解如何正确禁用它是至关重要的。

理解WordPress默认的jQuery加载机制

WordPress通过其脚本管理系统（wp_enqueue_script和wp_deregister_script等函数）来处理JavaScript库的加载。它为许多常用库（包括jQuery）注册了句柄。对于jQuery，WordPress内部注册的句柄是jquery。当WordPress需要加载jQuery时，它会查找这个句柄并根据配置（例如，是否启用了CDN）加载相应的脚本。

常见的错误尝试与正确方法

许多用户在尝试禁用Google CDN jQuery时，可能会错误地使用wp_deregister_script('jquery-js')这样的句柄。然而，WordPress内部用于jQuery的正确句柄是jquery，而不是jquery-js。因此，尝试注销一个不存在的句柄将不会有任何效果。

正确的方法是使用wp_deregister_script('jquery')来注销WordPress默认注册的jQuery脚本。

正确移除Google CDN jQuery的步骤

要从您的WordPress网站中移除由Google CDN加载的jQuery，您需要将以下代码添加到您的主题的functions.php文件中。

大师兄智慧家政

58到家打造的AI智能营销工具

99

查看详情

<?php
/**
 * 移除WordPress默认加载的Google CDN jQuery
 *
 * 当网站已存在jQuery脚本，或希望替换为自定义版本时使用。
 */
function custom_deregister_google_jquery() {
    // 确保只在前端（非管理后台）执行此操作
    if ( ! is_admin() ) {
        // 注销WordPress默认的jQuery脚本
        wp_deregister_script('jquery');
    }
}
// 将函数挂载到 wp_enqueue_scripts 动作钩子
// wp_enqueue_scripts 是前端脚本和样式加载的推荐钩子
add_action( 'wp_enqueue_scripts', 'custom_deregister_google_jquery' );
?>

代码解释：

• custom_deregister_google_jquery()：这是一个自定义函数，用于包含我们的注销逻辑。
• if ( ! is_admin() )：这个条件判断非常重要。它确保了我们的代码只在网站的前端执行，而不会影响到WordPress的管理后台。管理后台依赖WordPress自带的jQuery版本，禁用它可能会导致管理界面功能异常。
• wp_deregister_script('jquery')：这是核心操作。它告诉WordPress注销其内部注册的名为jquery的脚本。一旦注销，WordPress就不会再尝试加载这个脚本，包括通过Google CDN加载的版本。
• add_action( 'wp_enqueue_scripts', 'custom_deregister_google_jquery' );：这行代码将我们的自定义函数挂载到wp_enqueue_scripts动作钩子。wp_enqueue_scripts是WordPress推荐用于在前端页面加载或管理脚本和样式的钩子。确保在脚本被加载之前执行注销操作。

可选：替换为自定义jQuery版本

如果您不仅想移除Google CDN的jQuery，还希望替换为自己特定版本（例如，本地托管的版本或另一个CDN的特定版本），您可以在注销之后，立即注册并加载您的自定义版本。

以下示例展示了如何移除WordPress默认的jQuery，并替换为本地托管的jQuery 3.6.0版本：

<?php
/**
 * 移除WordPress默认加载的Google CDN jQuery并替换为自定义版本
 */
function custom_replace_jquery() {
    if ( ! is_admin() ) {
        // 1. 注销WordPress默认的jQuery脚本
        wp_deregister_script('jquery');

        // 2. 注册并加载您的自定义jQuery版本
        // 假设您的jQuery文件位于主题目录下的 'js/jquery-3.6.0.min.js'
        wp_enqueue_script(
            'jquery', // 使用相同的句柄 'jquery' 以确保依赖它的脚本能找到
            get_template_directory_uri() . '/js/jquery-3.6.0.min.js', // 您的jQuery文件路径
            array(), // 依赖项数组，这里为空，因为这是jQuery本身
            '3.6.0', // 版本号
            true // 在页脚加载脚本
        );
    }
}
add_action( 'wp_enqueue_scripts', 'custom_replace_jquery' );
?>

重要提示：

• 请确保get_template_directory_uri() . '/js/jquery-3.6.0.min.js'路径指向您实际的jQuery文件。
• 使用相同的句柄jquery可以确保任何依赖于WordPress默认jquery句柄的插件或主题脚本能够找到并使用您提供的jQuery版本。

注意事项与最佳实践

1. 备份functions.php：在修改主题的functions.php文件之前，务必进行备份。错误的修改可能导致网站无法访问。
2. 使用子主题：强烈建议通过子主题的functions.php文件进行修改，而不是直接修改父主题。这样可以避免在主题更新时丢失您的更改。
3. 检查依赖性：在移除或替换jQuery后，务必仔细检查您的网站功能。某些主题或插件可能对特定版本的jQuery有严格的依赖，或者它们可能在自己的脚本中硬编码了对特定jQuery版本的引用。
4. 测试：在生产环境应用更改之前，务必在开发或 staging 环境中彻底测试网站的所有功能，特别是那些依赖JavaScript的部分。检查浏览器控制台是否有JavaScript错误。
5. 缓存清除：进行更改后，请清除所有网站缓存（包括WordPress缓存插件、CDN缓存和浏览器缓存），以确保新的配置生效。
6. CDN与本地托管的选择：如果您选择替换jQuery，请根据您的用户群体和性能需求，权衡使用CDN（例如jsDelivr, Cloudflare CDN等）还是本地托管。CDN通常能提供更好的全球分发速度，但本地托管可以更好地控制版本和减少外部依赖。

总结

通过正确使用wp_deregister_script('jquery')函数并将其挂载到wp_enqueue_scripts动作钩子，您可以有效地从WordPress网站中移除由Google CDN加载的jQuery脚本。这有助于解决重复加载、性能瓶颈和版本冲突等问题。如果您需要替换为自定义的jQuery版本，请务必在注销后使用wp_enqueue_script()函数注册并加载您的新版本，并始终遵循最佳实践，确保网站的稳定性和兼容性。

以上就是优化WordPress：正确禁用Google CDN加载的jQuery的详细内容，更多请关注php中文网其它相关文章！