HTMLa标签中href属性的多种用法

HTML 中的 a 标签主要用于创建超链接和锚点。虽然大多数人认为 a 标签的主要功能是实现超链接，但其实它还有其他用途。本文将详细介绍 a 标签中 href 属性的多种用法。

一、调用 Javascript 方法

1. a href="Javascript:js_method();" 这是一种常见的方法，但在传递 this 等参数时容易出现问题。此外，使用 Javascript: 协议作为 href 属性会触发 window.onbeforeunload 事件，并且在 IE 中会使 GIF 动画停止播放。W3C 标准不推荐在 href 中执行 Javascript 语句。

2. a href="Javascript:void(0);" Onclick="js_method()" 这是许多网站最常用的方法，也是最全面的方法。onclick 事件负责执行 Javascript 函数，而 void(0) 返回 undefined，地址不会发生跳转。这种方法不会像第一种方法那样直接将 Javascript 方法暴露在浏览器的状态栏。

3. a href="Javascript:;" Onclick="js_method()" 这种方法与第二种类似，区别在于执行了一条空的 Javascript 代码。

4. a href="#" Onclick="js_method()" 这种方法在网上也很常见，# 是标签内置的一个方法，表示页面的顶部。因此，使用这种方法点击后页面会返回到最顶端。

5. a href="#" Onclick="js_method(); return false;" 使用这种方法点击后会执行 Javascript 函数并返回 false，页面不会发生跳转，仍然停留在当前页面的位置。

综合上述方法，在 a 标签中调用 Javascript 函数最推荐的方法是：

二、href="#" 的作用

在 a 标签中使用 href="#" 表示回到页面的最顶部。如果当前页面需要滚动，使用这种方式可以直接回到顶部。例如，有些网站会在右下角放置一个“回到顶部”的按钮，可以使用这种简单的方法实现。

回到最顶端

三、href="URL" 的作用

1. URL 为绝对 URL 此时指向另一个站点，例如 href="http://write.blog.csdn.net"，点击时会直接跳转到该链接的页面。

2. URL 为相对 URL 此时指向站点内的某个文件，例如 href="/test.doc"，点击时会直接下载文件。

3. 锚 URL 此时指向页面中的锚点，例如 href="#top"，点击时会跳转到当前页面中 id 为 top 的锚点，实现页面内部的跳转。这种用法在可滚动页面中非常常见，例如在导航菜单中直接跳转到页面的某个部分。

以下是所有三种用法的示例代码：

超链接
回到最顶端
文件链接