看个问题test,此时href的值是什么呢？带着这样的疑问，开始今天的话题‘href的那些事’。

问题分析

为什么会有这个问题呢？
上周在项目中，msui会对页面a标签绑定些事件，会用到href内容。href=""这么写，就会一直报错。因为浏览器此时获取到的href的值当前页面绝对路径。此时就会导致msui内部一直报错。

href的定义

w3c的定义

The href attribute on a and area elements must have a value that is a valid URL potentially surrounded by spaces.
Note：The href attribute on a and area elements is not required; when those elements do not have href attributes they do not create hyperlinks.

翻译过来大概的意思：

a和area标签上的href属性，必须是一个有效的RUI地址
a和area标签不一定有href属性，没有href就不会触发超链接的特点

RUL

w3c的定义

A string is a valid non-empty URL if it is a valid URL but it is not the empty string.
A string is a valid URL potentially surrounded by spaces if, after stripping leading and trailing whitespace from it, it is a valid URL.
A string is a valid non-empty URL potentially surrounded by spaces if, after stripping leading and trailing whitespace from it, it is a valid non-empty URL.

挺拗口的，翻译不出来了！

可以理解其中一点就是一个合法的URL不能为空。看来这个URL可以单独做个专题学习了。

解决问题

从href和URL上的定义就能很好的解决最开始的问题了。href=""这种写法是不合理的，浏览器自身会对此情况做些兼容，默认是页面的绝对地址了。

继续深挖href

href内容不仅仅只能是表现成链接，还有很多种用法。

锚点

头部
这种方式经常用于定位。相信很多人都知道这种用法。

script

我相信很多页面上有大量的这种代码。用href来执行脚本。

邮件

发邮件给我

tel电话

打电话给我

sms信息

发信息给我
除此之外，还支持ftp,file等。

下载文件

最后还有个技巧就是利用href来下载文件，这个是html5新增的。

最近有个需求，考虑通过前端来下载表格数据。
利用href和download属性。

这里只要将URL表现成数据格式"data:text/csv;charset=utf-8,\ufeff"+表格数据。这个等完成之后，再写个详细点的教程。

总结

写在最后，对于href的事情还不完整，欢迎补充补充。

原文地址http://xiaoqiang730730.github.io/2016/07/17/href%E9%82%A3%E4%BA%9B%E4%BA%8B/

关键字：html

版权声明

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击 举报 进行投诉反馈！