href属性必须正确填写,否则链接无效;外链需带https://协议,站内用相对路径或根路径,锚点跳转需目标元素id唯一且合法,target="_blank"必须配rel="noopener noreferrer"防安全风险。

href 属性必须写对,否则链接就是个摆设
不带 href 的 @#@#@#@#@#@#@#@#@#@0 —— 缺少 rel,危险。
锚点跳转失败?先检查 id 是否合法且唯一
页面内跳转靠的是 id,不是 name(HTML5 已废弃)。目标元素必须有 id,且该 id 值需满足 URL 片段标识符规范。
容易踩的坑:
-
id="常见问题?"或id="section 2"→ 包含中文、空格、问号等特殊字符,浏览器无法识别 -
id="header"在页面中重复出现多次 → 浏览器只滚动到第一个匹配项 - 目标元素被
display: none或visibility: hidden隐藏 → 滚动仍发生,但用户看不到目标位置
稳妥做法:id 只用小写字母、数字、短横线和下划线,例如:id="faq-section-1",链接写成:@#@#@#@#@#@#@#@#@#@1。
跳到其他页面的某个锚点,路径和 ID 要一起写
想从 index.html 直接跳到 about.html 的第二部分,不能只写 href="#section2"(那只是当前页内跳转),也不能只写 href="about.html"(没指定位置)。
必须拼接完整:
-
href="about.html#section2"→ 正确,相对路径 + 锚点 -
href="/about.html#contact"→ 正确,根相对路径 + 锚点(部署后可用) -
href="https://site.com/about.html#team"→ 正确,绝对 URL + 锚点
注意:单页应用(SPA)如 Vue Router 或 React Router 默认拦截 # 变化,这种跳转可能被路由库吞掉,需确认框架是否放行或改用编程式导航。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











