HTML标签用法详解

<a>标签可以算是我们写HTML组常用的几个标签之一了，因此就在这里详细梳理一下<a>标签的用法

一、作用

<a> 元素 (或锚元素) 可以创建一个到其他网页、文件、同一页面内的位置、电子邮件地址或任何其他URL的超链接。（MDN）

二、属性详解

• href属性

href属性是<a>标签必须要有的属性，它为<a>标签定义一个超文本链接，但是href属性的值有多种选择：

1. 最常见的值是一个网页的URL，如 <a href="http://qq.com">QQ</a>；
2. 无协议<a>标签，如 <a href="//qq.com">QQ</a>，此时所用协议与当前页面相同；
3. <a>标签href使用锚点#，此时点击<a>标签不发送请求，如 <a href="#aaa">aaa<a/>，此时点击a链接页面锚点变为aaa，使用锚点可以实现当前页面的跳转；
4. <a>标签href内容为空， <a href="">QQ</a>，点击a链接会刷新当前页面；
5. 类似 <a href="?name=xxx">a链接</a> 的<a>标签，再点击后会发送一个GET请求，请求的值就是 name=xxx
6. 使用路径作为href的值， <a href="main.html">main</a>，点击后会跳转到main.html；
7. 伪协议： <a href="javascript: alert(1);"></a> 会执行href中的JavaScript代码，<a href="javascript:;"></a>将不会执行任何操作；

• download属性

此属性指示浏览器下载URL而不是导航到URL
<a href="http://qq.com" download>QQ</a>在点击此链接后并不会打开 http://qq.com，而是将此网页保存到本地。
此属性仅适用于同源URLs

• target属性

该属性指定在何处显示链接的资源。target属性的四个关键字具有特殊的意义：

1. _self ：加载当前页面，如果没有指定属性，则此值为默认；
2. _top： 加载响应进入顶层页面，如果没有父级框架或页面，效果与 _self相同；
3. _parent：在父级页面打开地址；
4. _blank：在新窗口打开；

---

以上是<a>标签的常见用法，主要是href属性的值有较多种形式，以及target属性的部分值需要有iframe配合使用。
以上。