网页锚点链接跳转指定区域功能失效，点击跳转按钮无反应该如何解决

问题根因 #

• 原生HTML锚点跳转的匹配规则为：href="#xxx" 会寻找页面中**id属性值为xxx**的元素作为跳转目标，你当前给article标签设置的是class="sec"，浏览器无法找到匹配的锚点元素，因此点击没有反应。

修复方案 #

最便捷的修复方式是给目标article标签添加id="sec"属性，不会影响原有样式逻辑：

<article id="sec" class="sec">

其他可能的异常原因 #

如果按上述修改后仍然无法跳转，可以排查以下场景：

• 你给#exploreBtn绑定的点击事件中添加了e.preventDefault()，阻止了a标签的原生跳转行为，删除该阻止逻辑即可。
• 目标article元素被设置了display: none/visibility: hidden，元素处于不可见状态时浏览器不会触发锚点跳转。
• 页面整体高度不足，目标article本身已经处于当前可视区域内，点击后视觉上没有变化，可以临时给body设置height: 2000px验证是否属于该情况。

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