超链接的那些事(二): 属性href
a标签的属性之一 href
1. 定义
href 属性用于指定超链接目标的 URL。
2. 用法
①. 锚点
- 同一页面添加锚点
(1)<a href="#test">连接到本页面的锚的超链接</a> //点击的连接
(2)<a name="test">锚</a> //放到要跳转内容的地方
- 跨页面添加锚点
(1)在test2.html创建锚<a name="test">锚</a>
(2)在test1.html设置好连接<a href="test2.html#test">连接到另外页面的锚的超链接</a>
②. 下载
<a href="download.rar"></a>
href中的url需要有效,文件最好是rar格式
③. 打电话
<a href="tel:电话号码"></a>
④. 邮箱
邮箱标签: mailto
属 性: cc: 抄送
bcc: 暗抄
subject:主题
body:邮箱内容
- 常规
<a href="mailto: xxx@xx.com"></a>
- 利用逗号(,) 多地址发送
<a href="mailto: xxx@xx.com, xxx@xx.com"></a>
- 利用属性
<a href="mailto: xxx@xx.com?cc=xxx@xx.com&bcc=xxx@xx.com&subject=主题&body=内容"></a>
⑤. Javascript
- 直接调用javascript
<a href="javascript: function_name()"></a>
W3C标准不推荐在href里面执行javascript语句.这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。
- 使用void, ::, undefined, 配合onclick
<a href="javascript::" onclick="function_name()"></a>
<a href="javascript:void(0)" onclick="function_name()"></a>
<a href="javascript:undefined" onclick="function_name()"></a>
最常用的方法,也是最周全的方法,地址不发生跳转,不会在地址栏暴露Js方法
- '#'和onclick
<a href="#" onclick="function_name()"></a>
'#'是标签内置的一个方法,代表top的作用,所以执行方法后返回页面最顶端。
<a href="#" onclick="function_name(); return false;"></a>
执行'return false'后,页面不发生跳转,页面停留在当前位置。
未完待续....