Wordpress 加载 js 文件到底部
wp_enqueue_script
wp_enqueue_script( string $handle, string $src = '', array $deps = array(), string|bool|null $ver = false, bool $in_footer = false )
很明显最后一个参数 $in_footer 设置为 True 时,js 文件会被加载到文档底部。
核心 Jquery 文件
wordpress 内置了 jquery 类库。但默认是加载在页面头部的。
有两种方式, 一种先是删除核心的 jquery 包,再引自定义的 jquery 包到底部:
function my_scripts_method() {
wp_deregister_script( 'jquery' );
wp_register_script( 'jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js', true );
wp_enqueue_script( 'jquery' );
}
add_action('wp_enqueue_scripts', 'my_scripts_method');
另一种方式是有人读了wp_enqueque_script 的代码实现,如下:
function wp_register_script( $handle, $src, $deps = array(), $ver = false, $in_footer = false ) {
$wp_scripts = wp_scripts();
_wp_scripts_maybe_doing_it_wrong( __FUNCTION__ );
$registered = $wp_scripts->add( $handle, $src, $deps, $ver );
if ( $in_footer ) {
$wp_scripts->add_data( $handle, 'group', 1 );
}
return $registered;
}
所以正确的解决方案为:
add_action( 'wp_default_scripts', 'move_jquery_into_footer' );
function move_jquery_into_footer( $wp_scripts ) {
if( is_admin() ) {
return;
}
$wp_scripts->add_data( 'jquery', 'group', 1 );
$wp_scripts->add_data( 'jquery-core', 'group', 1 );
$wp_scripts->add_data( 'jquery-migrate', 'group', 1 );
}
REFs
https://developer.wordpress.org/reference/functions/wp_enqueue_script/
https://wordpress.stackexchange.com/questions/173601/enqueue-core-jquery-in-the-footer