0

0

如何在WordPress中正确禁用或移除默认加载的jQuery脚本

DDD

DDD

发布时间:2025-12-03 08:15:15

|

452人浏览过

|

来源于php中文网

原创

如何在wordpress中正确禁用或移除默认加载的jquery脚本

本教程旨在指导WordPress用户如何正确禁用或移除网站默认加载的jQuery脚本,以解决因重复加载、版本冲突或性能问题(如从Google CDN加载缓慢)导致的困扰。核心在于理解WordPress脚本管理的“句柄”概念,并使用`wp_deregister_script('jquery')`这一正确方法,而非常见的`jquery-js`,同时提供替换自定义jQuery的方案及重要注意事项。

引言:为何需要禁用WordPress默认的jQuery?

WordPress在默认情况下会加载jQuery库,这通常是为了确保主题和插件能够正常运行。然而,在某些场景下,用户可能希望禁用或替换这个默认加载的jQuery,主要原因包括:

  1. 性能优化: 默认加载的jQuery可能来自远程CDN(如Google CDN),如果CDN响应速度慢或网络条件不佳,会导致页面加载时间显著增加。
  2. 避免冲突: 自定义主题或某些插件可能已经包含了自己的jQuery版本,导致网站上同时加载多个jQuery实例,这不仅浪费带宽,还可能引发版本冲突,导致脚本错误。
  3. 版本控制: 开发者可能需要特定版本的jQuery来满足项目需求,而WordPress默认加载的版本可能不符合要求。

当您发现网站加载了多余的jQuery,或者默认jQuery加载缓慢时,正确地禁用它并按需加载自己的版本就显得尤为重要。

理解WordPress脚本管理:句柄的重要性

WordPress通过一套称为“脚本和样式表管理系统”的机制来处理前端资源。在这个系统中,每个脚本和样式表都被赋予一个唯一的“句柄”(handle)。当您需要对某个脚本进行操作(如禁用、注册、排队)时,必须使用其正确的句柄。

对于WordPress默认加载的jQuery,其内部句柄是jquery。许多用户在尝试禁用时,可能会误用jquery-js或jquery.js等变体,导致操作无效。这是因为jquery-js并非WordPress内部识别的jQuery句柄。

正确的禁用方法:使用wp_deregister_script('jquery')

要正确禁用WordPress默认加载的jQuery,您需要使用wp_deregister_script()函数,并传入正确的句柄jquery。此操作应在wp_enqueue_scripts动作钩子中执行,并建议添加条件判断,确保只在前端禁用,避免影响后台管理界面。

Dora
Dora

创建令人惊叹的3D动画网站,无需编写一行代码。

下载

以下是实现此功能的代码示例,您需要将其添加到当前活动主题的functions.php文件中:

<?php
/**
 * 禁用WordPress默认加载的jQuery
 */
function custom_remove_default_jquery() {
    // 确保只在网站前端禁用jQuery,不影响WordPress管理后台
    if (!is_admin()) {
        wp_deregister_script('jquery');
    }
}
// 将函数挂载到wp_enqueue_scripts动作钩子
add_action('wp_enqueue_scripts', 'custom_remove_default_jquery');
?>

代码解释:

  • custom_remove_default_jquery():这是一个自定义函数,用于执行禁用操作。
  • if (!is_admin()):这个条件判断非常重要,它确保只有在非WordPress管理后台的页面(即网站前端)才会执行wp_deregister_script('jquery')。这是为了避免禁用jQuery后导致WordPress管理界面出现功能问题。
  • wp_deregister_script('jquery'):这是核心函数调用,它会告诉WordPress取消注册名为jquery的脚本。一旦取消注册,WordPress就不会再将这个脚本排队加载到页面中。
  • add_action('wp_enqueue_scripts', 'custom_remove_default_jquery');:这行代码将您的自定义函数挂载到wp_enqueue_scripts动作钩子上。这个钩子是WordPress在准备加载所有前端脚本和样式时触发的,是管理前端脚本的最佳时机。

可选:禁用后如何加载自己的jQuery?

在禁用WordPress默认jQuery之后,如果您的网站仍然依赖jQuery(例如,主题或插件的某些功能需要),您需要手动注册并排队加载您自己的jQuery版本。这通常涉及以下步骤:

  1. 准备您的jQuery文件: 可以是来自您选择的CDN(如Cloudflare CDN、jsDelivr CDN)的URL,也可以是您上传到主题目录的本地文件。
  2. 使用wp_enqueue_script()函数: 在禁用默认jQuery的同一个函数中(或者另一个紧随其后的函数),使用wp_enqueue_script()来加载您的自定义jQuery。

以下是一个加载自定义jQuery的示例代码:

<?php
/**
 * 禁用WordPress默认加载的jQuery并加载自定义jQuery
 */
function custom_enqueue_my_jquery() {
    if (!is_admin()) {
        // 1. 禁用WordPress自带的jQuery
        wp_deregister_script('jquery');

        // 2. 注册并排队加载您自己的jQuery版本
        // 示例1:从CDN加载jQuery 3.6.0
        wp_enqueue_script(
            'jquery', // 句柄保持为'jquery',以便依赖于jQuery的脚本能找到它
            'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js', // 您选择的CDN路径
            array(), // 依赖项,这里没有其他依赖
            '3.6.0', // 版本号
            true // 在页脚加载脚本(true)或在头部加载(false)
        );

        // 示例2:加载主题目录下的本地jQuery文件 (如果需要,请取消注释并修改路径)
        /*
        wp_enqueue_script(
            'jquery',
            get_template_directory_uri() . '/js/jquery-3.6.0.min.js', // 假设您的jQuery文件在主题的/js/目录下
            array(),
            '3.6.0',
            true
        );
        */
    }
}
add_action('wp_enqueue_scripts', 'custom_enqueue_my_jquery');
?>

代码解释:

  • wp_enqueue_script('jquery', 'YOUR_JQUERY_URL', array(), 'VERSION', true);:
    • 第一个参数'jquery':保持句柄为jquery至关重要。这样,任何依赖于jquery句柄的脚本(例如wp_enqueue_script('my-script', 'my-script.js', array('jquery')))仍然能够找到并正确加载您的自定义jQuery。
    • 第二个参数'YOUR_JQUERY_URL':替换为您的jQuery文件的完整URL,可以是CDN链接或主题目录下的相对路径。
    • 第三个参数array():这是一个依赖数组。如果您的jQuery文件依赖于其他脚本才能运行,可以在这里列出它们的句柄。对于jQuery本身,通常没有外部依赖。
    • 第四个参数'VERSION':脚本的版本号。这有助于缓存管理。
    • 第五个参数true:如果设置为true,脚本将在页脚加载(即在

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
jquery插件有哪些
jquery插件有哪些

jquery插件有jQuery UI、jQuery Validate、jQuery DataTables、jQuery Slick、jQuery LazyLoad、jQuery Countdown、jQuery Lightbox、jQuery FullCalendar、jQuery Chosen和jQuery EasyUI等。本专题为大家提供jquery插件相关的文章、下载、课程内容,供大家免费下载体验。

156

2023.09.12

jquery怎么操作json
jquery怎么操作json

操作的方法有:1、“$.parseJSON(jsonString)”2、“$.getJSON(url, data, success)”;3、“$.each(obj, callback)”;4、“$.ajax()”。更多jquery怎么操作json的详细内容,可以访问本专题下面的文章。

334

2023.10.13

jquery删除元素的方法
jquery删除元素的方法

jquery可以通过.remove() 方法、 .detach() 方法、.empty() 方法、.unwrap() 方法、.replaceWith() 方法、.html('') 方法和.hide() 方法来删除元素。更多关于jquery相关的问题,详情请看本专题下面的文章。php中文网欢迎大家前来学习。

406

2023.11.10

jQuery hover()方法的使用
jQuery hover()方法的使用

hover()是jQuery中一个常用的方法,它用于绑定两个事件处理函数,这两个函数将在鼠标指针进入和离开匹配的元素时执行。想了解更多hover()的相关内容,可以阅读本专题下面的文章。

515

2023.12.04

jquery实现分页方法
jquery实现分页方法

在jQuery中实现分页可以使用插件或者自定义实现。想了解更多jquery分页的相关内容,可以阅读本专题下面的文章。

312

2023.12.06

jquery中隐藏元素是什么
jquery中隐藏元素是什么

jquery中隐藏元素是非常重要的一个概念,在使用jquery隐藏元素之前,需要先了解css样式中关于元素隐藏的属性,比如display、visibility、opacity等属性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

128

2024.02.23

jquery中什么是高亮显示
jquery中什么是高亮显示

jquery中高亮显示是指对页面搜索关键词时进行高亮显示,其实现办法:1、先获取要高亮显示的行,获取搜索的内容,再遍历整行内容,最后添加高亮颜色;2、使用“jquery highlight”高亮插件。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

183

2024.02.23

jQuery 正则表达式相关教程
jQuery 正则表达式相关教程

本专题整合了jQuery正则表达式相关教程大全,阅读专题下面的文章了解更多详细内容。

51

2026.01.13

C# ASP.NET Core微服务架构与API网关实践
C# ASP.NET Core微服务架构与API网关实践

本专题围绕 C# 在现代后端架构中的微服务实践展开,系统讲解基于 ASP.NET Core 构建可扩展服务体系的核心方法。内容涵盖服务拆分策略、RESTful API 设计、服务间通信、API 网关统一入口管理以及服务治理机制。通过真实项目案例,帮助开发者掌握构建高可用微服务系统的关键技术,提高系统的可扩展性与维护效率。

3

2026.03.11

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
PHP课程
PHP课程

共137课时 | 13.3万人学习

JavaScript ES5基础线上课程教学
JavaScript ES5基础线上课程教学

共6课时 | 11.3万人学习

PHP新手语法线上课程教学
PHP新手语法线上课程教学

共13课时 | 1.0万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号