通过URL的#hash值为对应手风琴元素加激活类失效，代码哪里有问题？

常见原因及解决方法 #

• 执行时机错误（最高发）
  代码在DOM元素未完成渲染时就提前执行，此时$(hash)无法匹配到还未生成的页面元素，自然无法添加类。
  解决方法：将逻辑包裹在jQuery的DOM加载完成回调中，确保元素渲染完成后再执行操作，示例代码：

$(document).ready(function() {
  const hash = window.location.hash;
  // 先判断哈希值非空、且能匹配到对应元素
  if (hash && $(hash).length) {
    $(hash).addClass('active-category');
    // 如果需要同步展开手风琴，可以在此处补充手风琴展开逻辑，例：
    // $(hash).find('.accordion-content').slideDown();
  }
});

如果你的手风琴有独立的初始化逻辑，需要把加类逻辑放在手风琴初始化完成之后执行，避免初始化操作重置类名。

• ID匹配错误
  HTML的ID属性是大小写敏感的，需确认要添加类的元素ID和哈希值完全匹配，无拼写错误、多余字符。
  排查方法：打开浏览器控制台，执行console.log($('#service1').length)，如果返回值为0，说明页面不存在对应ID的元素，请核对ID拼写和大小写。
• 特殊字符解析错误
  如果哈希值中包含.、[]等CSS选择器特殊字符，直接使用$(hash)会导致选择器解析失败，需要先对特殊字符做转义处理。
• 类名被其他逻辑覆盖
  如果手动在控制台执行$('#service1').addClass('active-category')可以成功加类，但页面加载完成后类自动消失，说明有其他JS逻辑在你的代码执行后移除了该类，需要调整代码执行顺序，放在所有同类操作之后执行。

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