WordPress 如何在页脚加载内置 jquery

为了提高网站的加载速度,我们一般会选择在网页</body>标签之前添加js文件。但是如何将WordPress 内置的jquery也在底部加载呢?本文将解决此问题。
WordPress 正确加载 javascript 文件的方法如下:

/**
 * Load scripts on the front end.
 *
 */
wp_enqueue_script( string $handle, string $src = '', array $deps = array(), string|bool|null $ver = false, bool $in_footer = false )

参数意义

$handle
(字符串) (必须) 此为脚本名称,必须唯一
$src
(字符串) (可选) 脚本的路径,可以是相对路径。。默认值:”。
$deps
(数组) (可选) 所加载的脚本依赖的脚本名称。默认值:array()
$ver
(字符串|布尔值|null) (可选) 字符串指定脚本的版本号。。默认值:false
$in_footer
(布尔值) (可选) 是否在</body>标签之前添加脚本,而不是在<head>标签里添加脚本。。默认值:false

问题

加载WordPress 内置的jquery脚本时添加如下代码,目的是在</body>标签之前添加jquery。

//enqueue wordpress jquery
wp_enqueue_script('jquery', '', '', '', true);

但是这样加载jquery,仍然在<head>标签里面,并且这样会同时加载两个文件,本别是jquery.js和jquery-migrate。jquery-migrate 是 jquery 版本之间迁徙过渡用的,说白了就是解决不同版本之间的兼容问题,在<head>中有如下代码:

<script type="text/javascript" src="http://***/wordpress/wp-includes/js/jquery/jquery.js"></script>
<script type="text/javascript" src="http://***/wordpress/wp-includes/js/jquery/jquery-migrate.min.js"></script>

解决办法

在stack overflow 中找到了如下方法,可以达到目的:

wp_enqueue_script('jquery-core', false, array(), false, true);
wp_enqueue_script('jquery-migrate', false, array(), false, true);

而使用后面这种方法时时将两个文件分别加载,这样就可以在实现在页脚加载Javascript 的目的,目前为发现新的问题,请各位测试之后,如有问题请告知。我们在进行探讨。

发表评论

  1. 八达网 回复

    新年好呀,新年好呀,祝福博主新年好!