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'后,页面不发生跳转,页面停留在当前位置。

未完待续....

超链接的那些事(二): 属性href的更多相关文章

  1. 超链接的那些事(三): 属性target

    a标签的属性之一 target 1. 定义     规定在何处打开链接文档. 如果a标签中有target属性,浏览器将会载入和显示用这个标签的 href 属性命名的.名称与这个目标吻合的框架或者窗口中 ...

  2. 【转载】Arcengine效率探究之二——属性的更新

    文转载自hymyjl2010<Arcengine效率探究之二——属性的更新>   修改一批要素的属性有多种方法,当数据量较大时,若选择不当可能会大大影响速度. 一.IRowBuffer 方 ...

  3. jQuery二——属性操作、文档操作、位置属性

    一.jquery的属性操作 jquery对象有它自己的属性和方法. 其中jquery的属性操作模块分为四个部分:html属性操作,dom属性操作,类样式操作和值操作. 1.html属性操作 是对htm ...

  4. .net到Java那些事儿--structs做了那些事(二)

    一.跟着项目先来看下structs怎么执行的      首先看下web.xml配置文件,下面有如下代码 <filter> <filter-name>struts2</fi ...

  5. 超链接(空链接-target-title属性)

    空链接:<a href="#">内容</a> 超链接标签: <a href=" " >内容</a> 属性: hr ...

  6. app 性能优化的那些事(二)

    来源:树下的老男孩 链接:http://www.jianshu.com/p/2a01e5e2141f 这次我们来说说iOS app中滑动的那些事.iOS为了提高滑动的流畅感,特意在滑动的时候将runl ...

  7. Android动画(二)-属性动画

    我们在上一篇博客中,讨论了视图动画与帧动画.那么这节课则要讨论更复杂,更强大的Property animation(属性动画). 视图动画使用简单,但是功能也简单.(只有那四种功能).并且也不改变Vi ...

  8. CSS(二)属性--文本设置

    HTML代码一 <body> <div>这是一个很黑很黑的夜晚,黑云密布,没有任何光亮透过.卖火柴的小姑娘.......</div> </body> C ...

  9. Arcengine效率探究之二——属性的更新(转载)

    http://blog.csdn.net/lk103852503/article/details/6570748 修改一批要素的属性有多种方法,当数据量较大时,若选择不当可能会大大影响速度. 一.IR ...

随机推荐

  1. Extjs各版本的下载链接

    Extjs的版本繁多,本文收集了Extjs各个版本的下载链接,包括官网和非官网的,以及各种汉化版api,欢迎大家下载分享. Extjs最新版下载链接:http://www.sencha.com/pro ...

  2. DuoCode测试

    http://duoco.de/ DuoCode 只能引用自己编译的DLL,不能引用外部DLL.这么做可以保证”代码编得过,就一定能跑“. SharpKit 遇到过这样的问题.在代码中使用了 list ...

  3. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(十三)之附加功能-自定义皮肤

    前言 本篇要讲的算是一个layim代码功能扩充.在原来的laim中已经有自带的换肤功能,而且在skin配置中,你可以添加自己想要的皮肤图片路径.这些内容在接下来都不会涉及,本篇要讲的是自定义皮肤功能, ...

  4. Win7打补丁以后vs2012突然出现的程序版本不兼容问题

    装这个: Update for Microsoft Visual Studio 2012 (KB2781514) http://www.microsoft.com/en-us/download/det ...

  5. nginx,php相关

    nginx安装 http://www.nginx.cn/install php安装 https://segmentfault.com/a/1190000004123048#articleHeader5 ...

  6. 在ios8中做的屏幕旋转功能

    http://www.cnblogs.com/smileEvday/archive/2013/04/24/Rotate2.html 思路出自这篇博主的文章. 直接上代码 -(void)willAnim ...

  7. 用通俗易懂的大白话讲解Map/Reduce原理

    Hadoop简介 Hadoop就是一个实现了Google云计算系统的开源系统,包括并行计算模型Map/Reduce,分布式文件系统HDFS,以及分布式数据库Hbase,同时Hadoop的相关项目也很丰 ...

  8. oracle中的case when then else end 用法

    Case when 的用法,简单Case函数 简单CASE表达式,使用表达式确定返回值. 语法: CASE search_expression WHEN expression1 THEN result ...

  9. jquery遍历的radio的取值问题

    html页面:<c:if test="${courseStandardVos != null }"> <c:set var="index" v ...

  10. express 4 中 session的处理(仅为博主笔记)

    1.app.js var express = require('express') var app = express();var routers = require('./router/index' ...