WordPress 如何在页脚加载内置 jquery

前言

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

需求

  • 加载WordPress 内置的jquery;
  • </body>标签之前添加jquery;

预想办法:

在functions.php中添加如下代码引入jquery;

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

存在的问题

  • 仍然在<head>标签里面;
  • 同时加载两个文件 ,分别是 jquery.js和jquery-migrate;其中 jquery-migrate 是 jquery 版本之间迁徙过渡用的,说白了就是解决不同版本之间的兼容问题

解决办法

/**
 * 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

正确引用方法:

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

而使用后面这种方法时时将两个文件分别加载,这样就可以在实现在页脚加载Javascript 的目的,且只加载jquery文件。

Leave a Reply

VisitorWelcome

2 comments on “WordPress 如何在页脚加载内置 jquery”