a标签必须含href属性才可点击跳转；有效值为相对路径（如about.html）或绝对URL（如https://example.com），禁用file://本地路径；target="_blank"须配rel="noopener noreferrer"防安全风险。
直接写 href 属性才能让 <a> 标签真正可点击；没它，就只是普通文字，浏览器不识别为链接。
href 值怎么写才有效跳转到另一个 HTML 文件
必须写对路径格式，否则 404 或刷新当前页。关键不是“怎么 fancy”，而是“怎么不挂”：
-
about.html：同目录文件，最常用、最安全 -
pages/contact.html：子目录下，注意别漏扩展名（contact不行，必须contact.html） -
../index.html：上一级目录，确认当前文件真在子目录里，否则路径错位 -
/products/list.html：根相对路径，部署到服务器没问题，但本地双击打开（file://）会失败——这时候只能用相对路径或起本地服务 - Windows 下大小写不敏感，Linux 服务器上
About.html和about.html是两个文件，部署前务必统一小写
href="#" 和 href="#top" 的实际行为差异
它们看起来差不多，但触发机制和副作用完全不同：
-
href="#"：不匹配任何id，强制滚动到页面顶部，同时修改 URL 哈希为空（#），可能被 Vue Router / React Router 拦截并触发不必要的路由重载 -
href="#top"：只在目标页面存在<div id="top"></div>时才滚动，无哈希变更风险；若不存在该id，则完全不滚动，也不报错 - 更可控的做法是去掉
href，用 JS 绑定点击事件：element.addEventListener('click', () => window.scrollTo({ top: 0, behavior: 'smooth' }))
target="_blank" 必须配 rel="noopener" 吗
必须。这不是“建议”，而是安全硬性要求：
立即学习“前端免费学习笔记（深入）”；
- 不加
rel="noopener"，新页面可通过window.opener访问原页面的window对象，可能被恶意页面篡改、跳转甚至窃取数据 - 完整写法应为：
<a href="https://example.com" target="_blank" rel="noopener noreferrer">外部链接</a> -
rel="noreferrer"还能防止Referer泄露来源地址，适合隐私敏感场景 - 如果只是想新开标签页但不跳转（比如纯 JS 处理），别用
href="#"，改用href="javascript:void(0)"并确保有 JS 绑定，否则就是死链接
最容易被忽略的是路径大小写和本地 file:// 协议下的根路径失效——开发时一切正常，上线就 404，问题往往不出在代码逻辑，而出在文件系统约定和部署环境差异上。
