如何使用JavaScript/jQuery根据特殊URL查询参数控制button显示隐藏

你的场景不需要强制解析标准键值对参数，直接匹配URL查询串中的目标特征串即可避开格式异常问题，以下是可直接运行的方案：

原生JavaScript实现 #

// 页面加载完成后执行
window.addEventListener('load', function() {
  const targetBtn = document.querySelector('.smallButton');
  // 直接判断查询串是否包含目标片段
  const shouldHide = location.search.includes('ABCDE=true');
  targetBtn.style.display = shouldHide ? 'none' : 'inline-block';
});

jQuery实现 #

// 页面DOM加载完成后执行
$(function() {
  // toggle方法传入布尔值：值为true显示，false隐藏，所以取反判断
  $('.smallButton').toggle(!location.search.includes('ABCDE=true'));
});

可选优化（适配大小写不敏感场景） #

如果URL中可能出现abcde=true、Abcde=True这类大小写差异，可以统一转小写后匹配：

// 原生版判断逻辑替换为
const shouldHide = location.search.toLowerCase().includes('abcde=true');

// jQuery版判断逻辑替换为
$('.smallButton').toggle(!location.search.toLowerCase().includes('abcde=true'));

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