href 属性可以使用的几种值
💡
原文中文，约1900字，阅读约需5分钟。
📝
内容提要
href 属性支持多种值，包括链接协议（如 mailto:、tel:、sms:、javascript:）、深度链接（如 PDF 页面）、数据 URL 和媒体片段链接，提供多样的导航和功能。
🎯
关键要点
- href 属性支持多种值，包括链接协议、深度链接、数据 URL 和媒体片段链接。
- 链接协议如 mailto:、tel:、sms: 和 javascript: 用于处理特定类型的链接。
- 深度链接可以链接到 PDF 中的特定页面，例如 my-file.pdf#page42。
- href="#" 可以滚动到文档顶部，如果没有 id="top" 的元素，也会滚动到顶部。
- href="" 可以重新加载当前页面，保留搜索字符串但移除哈希字符串。
- href="." 重新加载当前页面，同时移除搜索字符串和哈希字符串，需注意 URL 末尾的斜杠。
- href="?" 重新加载当前页面，移除搜索和哈希字符串，但保留 ? 字符。
- href="data:" 可以创建跳转到数据 URL 的链接，需注意编码以避免意外行为。
- href="video.mp4#t=10,20" 允许链接到媒体文件的特定部分，如视频的播放时间。
- 作者在浏览器和 JavaScript 中测试了这些功能，认为结果正确无误。
❓
延伸问答
href 属性支持哪些链接协议？
href 属性支持的链接协议包括 mailto:、tel:、sms: 和 javascript:。
如何使用 href 属性链接到 PDF 的特定页面？
可以使用深度链接，例如 my-file.pdf#page42 来链接到 PDF 的第 42 页。
href='' 和 href='.' 有什么区别？
href='' 会重新加载当前页面，保留搜索字符串但移除哈希字符串；而 href='.' 会重新加载当前页面，同时移除搜索字符串和哈希字符串。
如何使用 href 属性创建数据 URL 的链接？
可以使用 href='data:' 创建数据 URL 的链接，建议对数据进行编码以避免意外行为。
href='video.mp4#t=10,20' 的作用是什么？
href='video.mp4#t=10,20' 允许链接到视频的特定部分，从 10 秒开始播放，并在 20 秒停止。
href='#' 的作用是什么？
href='#' 可以滚动到文档顶部，如果没有 id='top' 的元素，也会滚动到顶部。
➡️
