求助：如何在WordPress移动端头部仅加载JavaScript脚本

嘿，我懂你那种想给WordPress移动端头部单独加段JS却屡试不爽的郁闷——我之前帮朋友排查过类似问题，下面几个靠谱的方案应该能帮你搞定：

WordPress自带的wp_enqueue_script是加载脚本的标准方式，配合移动端判断条件就能精准实现需求，而且不会破坏主题的脚本依赖逻辑。

把这段代码放到主题/子主题的functions.php文件里（一定要用子主题，不然主题更新会丢代码）：

function load_mobile_only_custom_js() {
    // 先用WordPress内置函数判断是否为移动端设备
    if ( wp_is_mobile() ) {
        // 注册并加载你的JS文件，按需修改参数
        wp_enqueue_script(
            'mobile-custom-script', // 脚本唯一标识，别和其他脚本重名
            get_template_directory_uri() . '/js/mobile-script.js', // 你的JS文件路径，子主题换成get_stylesheet_directory_uri()
            array(), // 依赖项，比如需要jQuery就写array('jquery')
            '1.0', // 版本号，方便缓存更新
            false // false表示在<head>里加载，true是footer加载
        );
    }
}
add_action( 'wp_enqueue_scripts', 'load_mobile_only_custom_js' );

如果想更精准（只针对手机，排除平板），可以自定义一个判断函数替换wp_is_mobile()：

function is_exactly_mobile_phone() {
    $user_agent = $_SERVER['HTTP_USER_AGENT'];
    // 匹配手机UA，过滤平板设备
    return preg_match('/(android|iphone|ipod|blackberry|opera mini|opera mobi|iemobile|windows phone)/i', $user_agent) 
           && !preg_match('/(ipad|tablet|kindle)/i', $user_agent);
}

function load_mobile_only_custom_js() {
    if ( is_exactly_mobile_phone() ) {
        wp_enqueue_script(
            'mobile-custom-script',
            get_template_directory_uri() . '/js/mobile-script.js',
            array(),
            '1.0',
            false
        );
    }
}
add_action( 'wp_enqueue_scripts', 'load_mobile_only_custom_js' );

如果你不想动functions.php，也可以直接编辑主题/子主题的header.php文件，找到<head>标签内部的合适位置，插入这段代码：

<?php if ( wp_is_mobile() ) : ?>
    <!-- 这里可以直接写JS代码，或者引入外部文件 -->
    <script>
        // 示例：移动端才会执行的JS
        console.log('我是移动端专属JS');
    </script>
    <!-- 或者引入外部JS文件 -->
    <script src="<?php echo get_template_directory_uri(); ?>/js/mobile-script.js"></script>
<?php endif; ?>

• 缓存搞鬼：如果用了WP Rocket、W3 Total Cache这类缓存插件，可能会合并脚本或者缓存了旧的判断逻辑，先清空所有缓存再测试。
• 路径错误：检查JS文件的路径是否正确，子主题要用get_stylesheet_directory_uri()，父主题用get_template_directory_uri()，别搞混。
• 钩子优先级：如果你的函数被其他插件/主题的脚本覆盖，试试调整add_action的第三个参数（数值越大越晚执行），比如add_action( 'wp_enqueue_scripts', 'load_mobile_only_custom_js', 100 );
• 测试方式不对：wp_is_mobile()是服务器端基于UA判断的，桌面端用浏览器开发者工具模拟移动端可能会有偏差，最好用真实手机测试，或者清空浏览器缓存再模拟。

内容的提问来源于stack exchange，提问作者Jung dev