html 页面跳转和锚点跳转无需 javascript，但需注意 url 路径合法性、id 锚点匹配、scroll-behavior 平滑滚动、url 编码规范及 hashchange 事件监听。
页面跳转和锚点跳转在 HTML 里根本不需要 JavaScript 就能完成，但很多人写错链接或忽略语义细节，导致跳转失败、SEO 受损或移动端体验异常。
用 @#@#@#@#@#@#@#@#@#@0，适合跨域或确保路径唯一
@#@#@#@#@#@#@#@#@#@1 → 页面内必须有 <div id="faq"></div>
name 属性在 HTML4 中可用，但已废弃，现代浏览器虽兼容但不保证行为一致（尤其 Safari 移动端偶发失效）<a href=".section2"></a> 不会触发锚点滚动，只是个无效字符串id="1st-item" 在部分旧浏览器中无法被锚点识别，建议用 id="item-1"
单页应用常用：用 scrollIntoView() 补足原生锚点的短板
原生锚点跳转无法控制滚动行为、偏移量或平滑度，且无法监听跳转完成事件。遇到导航栏吸顶、固定 header 遮挡内容时，必须干预。
- 加平滑滚动只需一行 CSS：
html { scroll-behavior: smooth; }，全局生效，无需 JS - 要避开固定 header（比如高 60px），用 JS 调整滚动位置：
document.getElementById('faq').scrollIntoView({ behavior: 'smooth', block: 'start', inline: 'nearest' }); - 如果锚点目标是动态插入的 DOM（如 Vue/React 渲染后），需确保元素已挂载再调用
scrollIntoView()，否则报错Cannot read property 'scrollIntoView' of null
混合跳转场景：带参数又带锚点，顺序和编码不能错
URL 同时含查询参数和锚点时，顺序固定为 ?key=value#anchor，且参数值必须 URL 编码，否则 # 会被截断为锚点起始符。
- 正确：
<a href="search.html?q=%E5%89%8D%E7%AB%AF+%E5%BC%80%E5%8F%91#results"></a>→q值已空格转+，#在末尾 - 错误：
<a href="search.html#results?q=%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91"></a>→ 浏览器认为锚点是results?q=前端开发，参数根本不会传给服务器 - 中文、斜杠、问号等字符必须编码，例如
q=前端/教程要写成q=%E5%89%8D%E7%AB%AF%2F%E6%95%99%E7%A8%8B；用encodeURIComponent()处理更安全
最容易被忽略的是：锚点跳转不会触发页面 reload，所以依赖 window.onload 或 DOMContentLoaded 初始化的 JS，对锚点滚动后的视图变化毫无感知——需要监听 hashchange 事件来补救。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
