jQuery：页面加载时为特定URL路径元素添加类的问题求助

原代码的问题 #

1. 路径获取错误：window.location.pathname仅返回URL的路径部分（比如/products/my-product），不包含?开头的查询参数，所以永远匹配不到/products/my-product?variant=12345。
2. 语法不完整：代码缺少闭合的}和});，导致脚本语法错误，无法正常执行。

正确实现方式 #

推荐使用URLSearchParamsAPI专门处理查询参数，更可靠且易维护：

$(document).ready(function() {
  // 解析URL查询参数
  const searchParams = new URLSearchParams(window.location.search);
  // 检查variant参数是否为目标值
  if (searchParams.get('variant') === '12345') {
    $('.sales-widget').addClass('sales-on');
  }
});

如果需要兼容不支持URLSearchParams的旧浏览器（如IE），可以用字符串匹配的方式：

$(document).ready(function() {
  const url = window.location.href;
  // 匹配?后或&后的variant=12345，避免误匹配类似variant=123456的情况
  if (url.includes('?variant=12345') || url.includes('&variant=12345')) {
    $('.sales-widget').addClass('sales-on');
  }
});

补充说明 #

如果需要同时限定产品页面路径，可以在判断中加入路径检查：

$(document).ready(function() {
  const searchParams = new URLSearchParams(window.location.search);
  const isTargetProduct = window.location.pathname === '/products/my-product';
  if (isTargetProduct && searchParams.get('variant') === '12345') {
    $('.sales-widget').addClass('sales-on');
  }
});

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