JS文件已正确加载但页面行为未改变的问题求助

核心原因 #

• WordPress静态资源版本缓存：WordPress会给JS/CSS文件自动添加?ver=xxx版本参数，长时间未编辑的文件，版本号会被固定。即使你修改了文件内容，浏览器仍会根据旧版本号加载缓存的资源——开发者工具显示的新代码可能是本地修改后的文件，但实际执行的是缓存的旧版本。
• 服务器端字节码缓存：如果你的PHP服务器开启了OPcache这类缓存，WordPress加载JS文件的路径或内容可能被缓存，导致服务器返回的还是旧文件，和你本地修改的内容不一致。
• CDN缓存（若启用）：如果网站用了CDN，旧JS文件会被CDN节点缓存，源站文件更新后，CDN依然会返回缓存的旧内容。

解决方法 #

1. 更新WordPress的资源版本号 #

找到主题functions.php里加载该JS文件的wp_enqueue_script代码，修改版本号参数：

// 手动更新版本号
wp_enqueue_script('my-old-script', get_template_directory_uri() . '/js/old-script.js', array(), '1.0.1', true);

// 自动用文件修改时间作为版本号（推荐，避免手动更新）
$script_version = filemtime(get_template_directory() . '/js/old-script.js');
wp_enqueue_script('my-old-script', get_template_directory_uri() . '/js/old-script.js', array(), $script_version, true);

修改后，WordPress会给JS文件添加新的?ver参数，强制浏览器加载新内容。

2. 清除服务器端OPcache缓存 #

• 如果你用的是PHP-FPM，执行命令重启服务：service php-fpm restart
• 用Apache的话执行：service apache2 restart
• 也可以通过主机管理面板（比如宝塔、cPanel）的一键清缓存功能操作。

3. 清除CDN缓存（若使用） #

登录CDN后台，找到对应JS文件的缓存规则，手动清除该文件缓存，或者直接刷新全站缓存。

4. 临时调试技巧 #

修改JS文件后，在浏览器地址栏直接访问该JS文件的URL，末尾加随机参数（比如?rand=12345），确认加载的是新内容后再刷新页面，无需修改函数名。

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