Aggiorna la versione di jquery

Question

Aggiorna la versione di jquery

- 32
- 51026 2017-02-21
Eseguo la versione 4.7.2 di WordPress.e utilizzajQuery versione 1.12.Hobisogno di aggiornare questa versione a una superiore.L'ho sostituito con unanuova versionein precedenza,ma quando aggiornoil core di WordPress vienenuovamente sostituito con la 1.12. Comeposso cambiare la versione dijQuery che WordPress utilizzain modopermanente?

I run WordPress version 4.7.2. and it uses jQuery version 1.12. I need to update this version to a higher one. I replaced it with a new version before, but when I upgrade WordPress core it is replaced with 1.12 again. How can I change the version of jQuery that WordPress uses permanently?

jquery

2 risposta

voti

12

2019-07-01

Ho sviluppato unpluginper questoproblema specifico. Ilpluginnon scherza con WordPressjQueryin quanto viene caricato solonelfront-end. Vedi: jQuery Managerper WordPress

Perché ancora un altrojQuery Updater/Manager/Developer/strumento di debug?

Perchénessuno degli strumentiper sviluppatoriti consente di selezionare unfile versione dijQuerye/ojQuery Migrate. Fornendo sia laproduzione e la versioneminimizzata. Vedi le caratteristiche di seguito!

✅ Eseguito solonelfront-end,noninterferisce con WordPress admin/backende personalizzatore WP (permotivi di compatibilità) Vedi: https://core.trac.wordpress.org/ticket/45130 e https://core.trac.wordpress.org/ticket/37110

✅ Attiva/disattiva jQuerye/ojQuery Migrate

✅ Attiva una versione specifica dijQuerye/ojQuery Migrate

Emolto altro ancora! Il codice è open source,quindipuoi studiare ,impara daessoe contribuisci.

Quasitutti usano l'handle sbagliato

WordPress utilizzaeffettivamente l'handlejquery-core,nonjquery:

https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php # L226
 // jQuery
$scripts->add( 'jquery', false, array( 'jquery-core', 'jquery-migrate' ), '1.12.4' );
$scripts->add( 'jquery-core', '/wp-includes/js/jquery/jquery.js', array(), '1.12.4' );
$scripts->add( 'jquery-migrate', "/wp-includes/js/jquery/jquery-migrate$suffix.js", array(), '1.4.1' );
 
L'handle jquery è solo un aliasper caricare jquery-core con jquery-migrate

Ulterioriinformazioni su alias: wp_register_scriptidentificatorimultipli?

Ilmodo correttoperfarlo

Nelmioesempio seguente utilizzoil CDNjQuery ufficiale su https://code.jquery.com anch'io utilizza script_loader_tag in modo dapoter aggiungere alcuni attributi CDN.
Potresti usareil seguente codice:

 // Front-end not excuted in the wp admin and the wp customizer (for compatibility reasons)
// See: https://core.trac.wordpress.org/ticket/45130 and https://core.trac.wordpress.org/ticket/37110
function wp_jquery_manager_plugin_front_end_scripts() {
    $wp_admin = is_admin();
    $wp_customizer = is_customize_preview();

    // jQuery
    if ( $wp_admin || $wp_customizer ) {
        // echo 'We are in the WP Admin or in the WP Customizer';
        return;
    }
    else {
        // Deregister WP core jQuery, see https://github.com/Remzi1993/wp-jquery-manager/issues/2 and https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226
        wp_deregister_script( 'jquery' ); // the jquery handle is just an alias to load jquery-core with jquery-migrate
        // Deregister WP jQuery
        wp_deregister_script( 'jquery-core' );
        // Deregister WP jQuery Migrate
        wp_deregister_script( 'jquery-migrate' );

        // Register jQuery in the head
        wp_register_script( 'jquery-core', 'https://code.jquery.com/jquery-3.3.1.min.js', array(), null, false );

        /**
         * Register jquery using jquery-core as a dependency, so other scripts could use the jquery handle
         * see https://wordpress.stackexchange.com/questions/283828/wp-register-script-multiple-identifiers
         * We first register the script and afther that we enqueue it, see why:
         * https://wordpress.stackexchange.com/questions/82490/when-should-i-use-wp-register-script-with-wp-enqueue-script-vs-just-wp-enque
         * https://stackoverflow.com/questions/39653993/what-is-diffrence-between-wp-enqueue-script-and-wp-register-script
         */
        wp_register_script( 'jquery', false, array( 'jquery-core' ), null, false );
        wp_enqueue_script( 'jquery' );
    }
}
add_action( 'wp_enqueue_scripts', 'wp_jquery_manager_plugin_front_end_scripts' );


function add_jquery_attributes( $tag, $handle ) {
    if ( 'jquery-core' === $handle ) {
        return str_replace( "type='text/javascript'", "type='text/javascript' integrity='sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=' crossorigin='anonymous'", $tag );
    }
    return $tag;
}
add_filter( 'script_loader_tag', 'add_jquery_attributes', 10, 2 );

I have developed a plugin for this specific problem. The plugin doesn't mess with WordPress jQuery as it is only loaded in the front-end. See: jQuery Manager for WordPress

Why yet another jQuery Updater / Manager / Developer / Debugging tool?

Because none of the developer tools lets you select a specific version of jQuery and/or jQuery Migrate. Providing both the production and the minified version. See features below!

✅ Only executed in the front-end, doesn't interfere with WordPress admin/backend and WP customizer (for compatibility reasons) See: https://core.trac.wordpress.org/ticket/45130 and https://core.trac.wordpress.org/ticket/37110

✅ Turn on/off jQuery and/or jQuery Migrate

✅ Activate a specific version of jQuery and/or jQuery Migrate

And much more! The code is open source, so you could study it, learn from it and contribute.

Almost everybody uses the incorrect handle

WordPress actually uses the jquery-core handle, not jquery:

https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226
// jQuery
$scripts->add( 'jquery', false, array( 'jquery-core', 'jquery-migrate' ), '1.12.4' );
$scripts->add( 'jquery-core', '/wp-includes/js/jquery/jquery.js', array(), '1.12.4' );
$scripts->add( 'jquery-migrate', "/wp-includes/js/jquery/jquery-migrate$suffix.js", array(), '1.4.1' );
The jquery handle is just an alias to load jquery-core with jquery-migrate

See more info about aliases: wp_register_script multiple identifiers?

The correct way to do it

In my example below I use the official jQuery CDN at https://code.jquery.com I also use script_loader_tag so that I could add some CDN attributes.
You could use the following code:

// Front-end not excuted in the wp admin and the wp customizer (for compatibility reasons)
// See: https://core.trac.wordpress.org/ticket/45130 and https://core.trac.wordpress.org/ticket/37110
function wp_jquery_manager_plugin_front_end_scripts() {
    $wp_admin = is_admin();
    $wp_customizer = is_customize_preview();

    // jQuery
    if ( $wp_admin || $wp_customizer ) {
        // echo 'We are in the WP Admin or in the WP Customizer';
        return;
    }
    else {
        // Deregister WP core jQuery, see https://github.com/Remzi1993/wp-jquery-manager/issues/2 and https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226
        wp_deregister_script( 'jquery' ); // the jquery handle is just an alias to load jquery-core with jquery-migrate
        // Deregister WP jQuery
        wp_deregister_script( 'jquery-core' );
        // Deregister WP jQuery Migrate
        wp_deregister_script( 'jquery-migrate' );

        // Register jQuery in the head
        wp_register_script( 'jquery-core', 'https://code.jquery.com/jquery-3.3.1.min.js', array(), null, false );

        /**
         * Register jquery using jquery-core as a dependency, so other scripts could use the jquery handle
         * see https://wordpress.stackexchange.com/questions/283828/wp-register-script-multiple-identifiers
         * We first register the script and afther that we enqueue it, see why:
         * https://wordpress.stackexchange.com/questions/82490/when-should-i-use-wp-register-script-with-wp-enqueue-script-vs-just-wp-enque
         * https://stackoverflow.com/questions/39653993/what-is-diffrence-between-wp-enqueue-script-and-wp-register-script
         */
        wp_register_script( 'jquery', false, array( 'jquery-core' ), null, false );
        wp_enqueue_script( 'jquery' );
    }
}
add_action( 'wp_enqueue_scripts', 'wp_jquery_manager_plugin_front_end_scripts' );


function add_jquery_attributes( $tag, $handle ) {
    if ( 'jquery-core' === $handle ) {
        return str_replace( "type='text/javascript'", "type='text/javascript' integrity='sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=' crossorigin='anonymous'", $tag );
    }
    return $tag;
}
add_filter( 'script_loader_tag', 'add_jquery_attributes', 10, 2 );

Fayaz · Accepted Answer · 2017-02-21

38

2017-02-21

<⇨Avviso : Non dovresti sostituire la versioneprincipale dijQuery, specialmentenelpannello di amministrazione . Poichémoltefunzionalitàprincipali di WordPresspossono dipendere dalla versione. Inoltre,altripluginpossono dipendere dalla versione jQuery aggiuntanel core.

Se sei sicuro di voler cambiare la versioneprincipale di jQuery,in tal casopuoi aggiungereil seguente CODICEnelfile functions.php deltuotema attivo (anchemeglio se crei unpluginper questo):

 function replace_core_jquery_version() {
    wp_deregister_script( 'jquery' );
    // Change the URL if you want to load a local copy of jQuery from your own server.
    wp_register_script( 'jquery', "https://code.jquery.com/jquery-3.1.1.min.js", array(), '3.1.1' );
}
add_action( 'wp_enqueue_scripts', 'replace_core_jquery_version' );

Questo sostituirà la versione jQueryprincipalee caricheràinvece la versione 3.1.1 dal server di Google.

Inoltre,sebbene sconsigliato ,puoi utilizzare la seguente riga aggiuntiva di CODICEper sostituire anche la versionejQueryin wp-admin :

 add_action( 'admin_enqueue_scripts', 'replace_core_jquery_version' );

In questomodo,anche dopo aver aggiornato WordPress,avrai la versione di jQuery che desideri.

Unafunzione leggermentemigliore:

Lafunzione replace_core_jquery_version sopra rimuove anche lo script jquery-migrate aggiunto dal core di WordPress. Questo è ragionevole,perché la versionepiù recente dijQuerynonfunzionerà correttamente con una versioneprecedente di jquery-migrate. Tuttavia,puoiincludere anche una versionepiù recente di jquery-migrate. Intal caso,utilizzainvece la seguentefunzione:

 function replace_core_jquery_version() {
    wp_deregister_script( 'jquery-core' );
    wp_register_script( 'jquery-core', "https://code.jquery.com/jquery-3.1.1.min.js", array(), '3.1.1' );
    wp_deregister_script( 'jquery-migrate' );
    wp_register_script( 'jquery-migrate', "https://code.jquery.com/jquery-migrate-3.0.0.min.js", array(), '3.0.0' );
}

Warning: You shouldn't replace core jQuery version, especially in the admin panel. Since many WordPress core functionality may depend on the version. Also, other plugin may depend on the jQuery version added in the core.

If you are sure that you want to change the core jQuery version, in that case you may add the following CODE in your active theme's functions.php file (even better if you create a plugin for this):

function replace_core_jquery_version() {
    wp_deregister_script( 'jquery' );
    // Change the URL if you want to load a local copy of jQuery from your own server.
    wp_register_script( 'jquery', "https://code.jquery.com/jquery-3.1.1.min.js", array(), '3.1.1' );
}
add_action( 'wp_enqueue_scripts', 'replace_core_jquery_version' );

This will replace core jQuery version and instead load version 3.1.1 from Google's server.

Also, although not recommended, you may use the following additional line of CODE to replace the jQuery version in wp-admin as well:

add_action( 'admin_enqueue_scripts', 'replace_core_jquery_version' );

This way, even after updating WordPress, you'll have the version of jQuery as you want.

A slightly better function:

The replace_core_jquery_version function above also removes jquery-migrate script added by WordPress core. This is reasonable, because the newest version of jQuery will not work properly with an older version of jquery-migrate. However, you can include a newer version of jquery-migrate as well. In that case, use the following function instead:

function replace_core_jquery_version() {
    wp_deregister_script( 'jquery-core' );
    wp_register_script( 'jquery-core', "https://code.jquery.com/jquery-3.1.1.min.js", array(), '3.1.1' );
    wp_deregister_script( 'jquery-migrate' );
    wp_register_script( 'jquery-migrate', "https://code.jquery.com/jquery-migrate-3.0.0.min.js", array(), '3.0.0' );
}

fonte
Fayaz

Puoi semplicemente rimuovere l'azione dafunctions.php se scopri cheinterrompeiltuotema?Tornerà alla versione originale dijQuery o sitratta di unamodificapermanente?

Can you just remove the action from functions.php if you find that it breaks your theme? Will it revert back to the original jQuery version or is this a permanent change?
- 0
- 2018-08-23
- Nick
Se lafunzione di callback dell'azione `wp_enqueue_scripts` aggiorna solojQuerye jQuery viene accodato da qualche altraparte,la rimozione dell'azione ripristineràjQuery originale.Tuttavia,a voltei browsermemorizzanonella cacheil vecchio CODICE,a seconda delleimpostazioni della cache del server,quindi dovrai svuotare la cache delbrowser dopo averlofattoper vedere lamodifica.

If the callback function of the `wp_enqueue_scripts` action only updates jQuery and jQuery is being enqueued from somewhere else, then removing the action will restore original jQuery. However, sometimes browsers cache old CODE, depending on server cache settings, So, you'll need to clear browser cache after you do that to see the change.
- 1
- 2018-08-23
- Fayaz
okgrazie,volevo solo assicurarmi dinon aver rovinatoilmio sitoprima di aggiungere questa azione.Avevo la sensazione che quello che hai dettofosse accurato,ma volevogiocare sul sicuro.

ok thanks i just wanted to make sure i didn't screw up my site before adding this action. I had a feeling what you said is accurate but I wanted to play it safe.
- 0
- 2018-08-23
- Nick
Questo ovviamente **non èpermanente **,poiché questamodifica dipende dal CODICE stesso,non viene salvatonullanel database.Quindi la rimozione del CODICE correlato ripristineràil vecchio stato.

This is obviously **not permanent**, as this change depends on the CODE itself, nothing is saved on the database. So removing the related CODE will revert back to old the state.
- 1
- 2018-08-23
- Fayaz
Lo script dimigrazioneper le versioni 3.xnonfunziona quandoplugin/temi prevedono una versioneinferiore alla 1.12.Maggioriinformazioni su questo qui: https://wordpress.stackexchange.com/a/244543/75495

The migrate script for 3.x versions does not work when plugins/themes expect a version below 1.12. More about that here: https://wordpress.stackexchange.com/a/244543/75495
- 0
- 2018-10-24
- cjbj
@cjbj ovviamente è così.Tuttavia,la domanda riguardava l'eliminazione di "1.12",quindi ovviamente la rispostanon lo copre.

@cjbj of course that's the case. However, the question was about ditching `1.12`, so obviously the answer doesn't cover that.
- 0
- 2018-10-24
- Fayaz
Purtroppo,non sembrafunzionarein WordPress 5. Il vecchio Jquery viene scaricato,mailnuovonon viene caricato.

Sadly, does not appear to work in WordPress 5. The old Jquery is unloaded, but the new is not loaded.
- 0
- 2020-03-05
- TelFiRE