引言

最近在做项目的时候发现了一些以前没有注意过但很有用的标签属性，现在来一个一个的过一下，希望能每天一个，笔耕不辍，每天一点小收获。按字母的排列顺序，从 a 到 z 来一遍，分3部分：定义、属性、作用，穿插一些在实际开发中的常用功能。

定义

mdn定义， 一般都说 a 链接，或者锚点，就是一个传送门，去你想去的任何地方。

属性

这里介绍比较常用的属性：

href

传送门到达的位置由href来指定：

1. 传送到页面里某个部分，通过哈希标记当前页面的特定位置，同时url上会加上此哈希值，如：
   • href="#top"，或者 href="#"，返回页面顶部
   • href="#id1"，跳转（其实是滚动条滚动到）到设置了 id="id1" 的标签处
   • href="javascript:void(0)"，某些不正确的用法，阻止页面刷新的伪链接，用来模拟按钮，最好还是用button吧
2. 传送到页面外，可以使用浏览器支持的任何协议，如：
   • http://: 完整url跳转
   • mailto: 调起邮件程序发送邮件
   • tel: 调起打电话
   • file:
   • ftp:

download

告诉浏览器要下载这个url（href的值），且下载的文件名为download属性的值，而不是跳转过去（哦。。我之前都不知道这个属性），仅限于同源的url。但是可以使用二进制 blob: 或者base64 data: 以方便下载 js 生成的东西。一个实际应用场景是，可以把canvas转成二进制blob或者base64，赋值给a的href属性，并且把文件名赋予download属性，点击就可以直接下载这个图片了～exciting！

target

告诉浏览器在哪里打开这个url：

• _self: 默认值，在本页面打开，即刷新本页面
• _blank: 新窗口打开
• _parent: 当前窗口的父窗口，即内嵌iframe的父窗口，如果没有就是本身
• _top: 内嵌了很多个iframe的最顶层父窗口，如果没有就是本身
• 除上面4个以外，还能是其他iframe的name属性，在另一个iframe中打开url，或者另一个window/tab（mdn如是说，我也没有试过）

css属性

a是一个行内元素，有4种状态对应4个伪类：

a:link { color: blue; }          /* 未访问链接 */
a:visited { color: purple; }     /* 已访问链接 */
a:hover { background: yellow; }  /* 用户鼠标悬停 */
a:active { color: red; }         /* 激活链接 */