問題描述

我不能在外掛 javascripts 中新增延遲標記。 Google 開發人員的 pagepeed 測試建議我新增 defer 標籤的聯絡方式 7 javascripts 。

這是接觸表格 7 如何在標題中包含 JavaScript 。

add_action( 'wp_enqueue_scripts', 'wpcf7_enqueue_scripts' );

function wpcf7_enqueue_scripts() {
    // jquery.form.js originally bundled with WordPress is out of date and deprecated
    // so we need to deregister it and re-register the latest one
    wp_deregister_script( 'jquery-form' );
    wp_register_script( 'jquery-form', wpcf7_plugin_url( 'jquery.form.js' ),
        array( 'jquery' ), '2.52', true );

    $in_footer = true;
    if ( 'header' === WPCF7_LOAD_JS )
        $in_footer = false;

    wp_enqueue_script( 'contact-form-7', wpcf7_plugin_url( 'scripts.js' ),
        array( 'jquery', 'jquery-form' ), WPCF7_VERSION, $in_footer );

    do_action( 'wpcf7_enqueue_scripts' );
}

現在如何在上面的程式碼中新增 defer = “defer” 標籤？

最佳解決方案

從 WordPress 4.1 起，有一個過濾器：script_loader_tag 。您可以使用它來查詢正確的指令碼：

add_filter( 'script_loader_tag', function ( $tag, $handle ) {

    if ( 'contact-form-7' !== $handle )
        return $tag;

    return str_replace( ' src', ' defer="defer" src', $tag );
}, 10, 2 );

老回答

沒有專用的過濾器可用… 至少我看不到。但是…

  •  wp_print_scripts()呼叫 WP_Scripts->do_items()

  • 它呼叫 WP_Scripts->do_item()

  • 使用 esc_url()

  • 它提供了一個過濾器：'clean_url'。

現在我們開始：

function add_defer_to_cf7( $url )
{
    if ( FALSE === strpos( $url, 'contact-form-7' )
      or FALSE === strpos( $url, '.js' )
    )
    { // not our file
        return $url;
    }
    // Must be a ', not "!
    return "$url' defer='defer";
}
add_filter( 'clean_url', 'add_defer_to_cf7', 11, 1 );

警告：沒有測試，只是一個想法。 🙂

Update

我用這段程式碼編寫和測試了一個外掛。見 https://gist.github.com/1584783

參考文獻

注：本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。