Wordpres的php代码如何向网页js脚本传递变量
问题:js中需要判断当前网页是否是前端时,需要php代码中把判断的变量传递到前端js中
方案:传递给自己的脚本(推荐)
function theme_custom_scripts() {
// 先注册/排队依赖
wp_enqueue_script('jquery');
// 准备要传递的数据
$wp_vars = array(
'is_front_page' => is_front_page(),
'ajax_url' => admin_url('admin-ajax.php'),
'theme_url' => get_template_directory_uri(),
'home_url' => home_url('/'),
'current_url' => get_permalink(),
);
// 注册 public.js 但不立即排队
wp_register_script(
'public-js',
JS_DIR . 'public.js',
array('jquery'),
THEME_VERSION,
true
);
// 向 public-js 传递数据
wp_localize_script('public-js', 'wp_vars', $wp_vars);
// 最后排队脚本
wp_enqueue_script('public-js');
}
add_action('wp_enqueue_scripts', 'theme_custom_scripts');
注意点:
wp_localize_script('jquery', ...)是错误的jquery是 WordPress 核心脚本句柄- 不应该直接向核心脚本传递变量
- 应该传递给你的脚本,或者使用独立的脚本句柄
- 变量可能传递失败
jquery可能已经加载完成,无法再添加数据- 变量应该在
public-js之前定义
2. 在前端public.js脚本中,就可以拿到wp_vars 变量来进行判断是否是网站首页
$(function () {
// 直接使用 WordPress 传递的变量,仅首页初始化对象
if (typeof wp_vars !== 'undefined' && wp_vars.is_front_page) {
// 首页专用代码
}