如何在插件JavaScript中添加defer =“ defer”标签?


28

我无法在插件JavaScript中添加延迟标记。Google开发人员的pagespeed测试建议我在联系表单7 javascripts中添加defer标签。

这就是联系表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”标签?



1
好问题@Viruthagiri。
Ramkumar M

Answers:


56

从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 );

警告:未经测试,只是一个想法。:)

更新资料

我已经用此代码编写并测试了一个插件。参见https://gist.github.com/1584783


这也非常适合与requirejs中的数据主体一起使用
Nicola Peluchetti 2012年

这是一个不错的技巧,而且非常简单。我认为在必要时添加charset ='utf-8'也很好!
webaware

很好,但是为什么:必须是',而不是'!?
henrywright 2014年

@henrywright WordPress '在返回的字符串的两边添加,"将导致无效的HTML。
fuxia

2
如果有人希望将此功能与其他脚本一起使用,则可能是一个好主意,那就是确保确认仅在字体端使用它,也许使用if( ! is_admin() ){}诸如ACF之类的流行插件可能会让您头疼。
crissoca15年
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.