HTML超链接通过href属性指定跳转目标（如URL、邮箱、锚点等），target属性控制打开方式（如_self、_blank），需搭配rel="noopener"保障安全，并注意路径正确性与标签闭合。
设置 HTML 超链接的跳转目标和打开方式，核心是用好 <a> 标签的两个关键属性：href 指定去哪，target 决定怎么打开。
href 属性：明确跳转目的地
href（Hypertext Reference）是必需属性，值必须是有效的地址。不同场景写法不同：
- 外部网站：写完整 URL，如
href="https://www.example.com" - 本地页面：用相对路径，如
href="about.html"或href="../contact/index.html" - 邮箱链接：用
mailto:协议，如href="mailto:admin@example.com?subject=反馈" - 电话号码：用
tel:协议，如href="tel:+8613800138000" - 页面内锚点：用
#加目标元素的id，如href="#section2"，对应<h3 id="section2">第二部分</h3>
target 属性：控制打开位置
target 决定链接点击后在哪个上下文中加载内容，默认是当前标签页。常用取值：
-
target="_self"：在当前标签页打开（省略该属性时默认行为） -
target="_blank"：在新标签页打开，适合外链，但需搭配安全属性 -
target="_top"：在整个窗口打开，常用于跳出 iframe 嵌套
注意：target="_blank" 若不加防护，可能被恶意页面通过 window.opener 访问原页面。建议始终加上 rel="noopener"，例如：<a href="https://example.com" target="_blank" rel="noopener">外部链接</a>
组合使用：常见实用写法
实际开发中，href 和 target 往往一起出现，再辅以其他属性提升体验或安全性：
立即学习“前端免费学习笔记（深入）”；
- 跳转到新页的外部链接：
<a href="https://baidu.com" target="_blank" rel="noopener">百度</a> - 回到页面顶部：
<a href="#top">回到顶部</a>，配合<main id="top"></main> - 下载文件：
<a href="report.pdf" download="年度报告.pdf">下载PDF</a> - 带语言提示的外链（可选）：
<a href="https://github.com" hreflang="en" rel="noopener">GitHub</a>
检查链接是否生效的小提醒
如果点击没反应，优先排查这几项：
- href 值是否拼写正确，有无多余空格或中文标点
- 相对路径是否与当前 HTML 文件位置匹配（可用浏览器开发者工具的 Network 面板看请求是否 404）
- CSS 是否设置了
a { pointer-events: none; }或display: none; - <a> 标签是否被意外嵌套在另一个可点击元素中，导致事件拦截
- 是否遗漏了结束标签
</a>，造成后续 HTML 解析错乱
