WordPress（Divi主题）站点修改URL参数未生效如何解决？

你现有的代码仅在内存中创建了参数对象并修改了数值，没有将修改后的参数同步到浏览器地址栏，所以不会生效，可根据你的需求选择对应方案：

方案1：不刷新页面修改地址栏参数 #

如果不需要页面重新加载，仅修改地址栏显示的参数值，使用history.replaceState同步修改结果即可，不会触发页面刷新：

const queryParams = new URLSearchParams(window.location.search);
queryParams.set("button", "0");
// 拼接完整新URL
const newUrl = `${window.location.origin}${window.location.pathname}?${queryParams.toString()}${window.location.hash}`;
// 替换当前地址栏记录
window.history.replaceState(null, '', newUrl);

如果需要本次修改支持浏览器后退按钮返回修改前的参数，将replaceState替换为pushState即可。

方案2：修改参数后刷新页面生效 #

如果参数修改后需要页面重新加载读取新参数值，直接重定向到新参数地址即可：

const queryParams = new URLSearchParams(window.location.search);
queryParams.set("button", "0");
window.location.search = queryParams.toString();

Divi主题适配注意事项 #

Divi主题存在脚本延迟加载、动态内容渲染逻辑，代码执行时机不对会导致失效，需要做对应调整：

• 如果是在Divi全局主题选项的「集成」板块添加代码，需要将逻辑包裹在DOM加载完成的监听事件中：

document.addEventListener('DOMContentLoaded', function() {
  // 将上面选好的参数修改代码放在此处
});

• 如果是在单个页面的Divi编辑器内添加代码模块，建议将代码模块放置在页面最底部，保证页面基础内容加载完成后再执行脚本。

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