#说起a标签真实功能强大呀,所以做个总结怕自己忘了

a标签的强大功能都要归咎于href属性可以为多种类型

1、< a href="#" >的作用:点击标签链接到网页的顶端


<a href="#">回到最顶端</a>


2、href="url"的作用(URL分为绝对路径和相对路径)

  • URL:统一资源定位符(URL,英语Uniform Resource Locator的缩写)也被称为网页地址,是因特网上标准的资源的地址。
  • URL的结构:基本URL包含模式(或称协议)、服务器名称(或IP地址)、路径和文件名组成。
  • 绝对路径:引入文件的真实存在路径(和当前文件没有关系)
  • 相对路径:引入的文件相对于当前文件的路径

  URL的类型有很多一种是网页类型比如百度页面:https://www.baidu.com/ 一种是文件类型的比如图片:      http://baidu.com/i.img(还可以是文档、PPT等)。如果是网页的话是直接打开网页,但是如果是文件类型则是下载哦,这里还是有区别的


//跳转到百度页面 <a href="http://baidu.com">超链接</a> //下载文件 <a href="http://baidu.com/i.img">超链接</a>


3、href=#id/name(id是元素的id属性值,name是元素的name属性值,但是前面必须有#号告诉他你这个锚点)

这个跳转有两种情况一种是跳到页面内的指定的锚点元素,另一种是跳到其他页面的指定锚点

  • 页内跳转:

//点击此处会跳到标记1 <a href="#1">锚点1</a> //点击此处会跳到标记2 <a href="#2">锚点1</a> <div id="1">标记1</div> <div name="2">标记2</div>


  • 其他页面跳转

1.html //此时就会跳转到2.html的标记1处 <a href="2.html/#1">锚点1</a> <div id="1">标记1</div> 2.html <div id="1">标记1</div>


4、href="JavaScript:;"

(javascript:是伪协议,它可以让我们通过一个链接来调用javascript函数.而采用这个方式 javascript:;可以实现a标签的点击事件运行时,如果页面内容很多,有滚动条时,页面不会乱跳,用户体验更好)


//void是一个操作符,void(0)返回undefined,地址不发生跳转,会执行onclick里面的方法 <a href="javascript:void(0)" οnclick="sub();">方法</a> //#是标签内置的一个方法,代表top的作用。点击网页后返回到页面的最顶端。 <a href="#" οnclick="sub();">方法</a> //js函数后return false,页面不发生跳转,执行后还是在页面的当前位置 <a href="#" οnclick="sub();return false;">方法</a>


5、a标签还有一个功能就是发邮件

语法:

<a href="mailto:xxxxl@xxx.com?cc=抄送的人&bcc=秘密抄送的人&subject=邮件标题&body=邮件内容">告诉我们</a>

发送一个完整的邮件大概有五部分(除了收件人是必填的其他的可以选填哦)

mailto:收件人的邮箱地址

cc:需要抄送的人

bcc:秘密抄送的人

subject:邮件的主题

body:邮件的主题