众所周知，a标签的最重要功能是实现超链接和锚点。而且，大多数人认为a标签最重要的作用是实现超链接，今天我刚好碰到a标签的一种写法<a href="JavaScript:;"></a>，所以就来整理下a标签中href的几种用法。

一、js的几种调用方法（参考总结的）

      1、a href="javascript:js_method();"

       这是常用的方法，但是这种方法在传递this等参数的时候很容易出问题，而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件，在IE里面更会使gif动画图片停止播放。W3C标准不推荐在href里面执行javascript语句

       2、 a href="javascript:void(0);" onclick="js_method()"

       这种方法是很多网站最常用的方法，也是最周全的方法，onclick方法负责执行js函数，而void是一个操作符，void(0)返回undefined，地址不发生跳转。而且这种方法不会像第一种方法一样直接将js方法暴露在浏览器的状态栏。

       3、a href="javascript:;" onclick="js_method()"

       这种方法跟跟2种类似，区别只是执行了一条空的js代码。

      4、a href="#" onclick="js_method()"

       这种方法也是网上很常见的代码，#是标签内置的一个方法，代表top的作用。所以用这种方法点击后网页后返回到页面的最顶端。

     5、a href="#" onclick="js_method();return false;"

       这种方法点击执行了js函数后return false，页面不发生跳转，执行后还是在页面的当前位置。

      综合上述，在a中调用js函数最适当的方法推荐使用：

 <a href="javascript:void(0);" onclick="js_method()"></a> 
<a href="javascript:;" onclick="js_method()"></a> 
<a href="#" onclick="js_method();return false;"></a> 

二、href="#"的作用

       a中href="#"表示回到最顶部。如果当前页面中需要滚动的话，那么用这种方式就可以直接回到顶部。比如有些网站会在右下角制作一个图标按钮，回到顶部，那么此时可以考虑用这种最简单的方式实现。

<span style="font-size:14px;"><a href="#">回到最顶端</a></span> 

三、href="URL"的作用

     1、URL为绝对URL

     此时指向另一个站点，比如href="http://write.blog.csdn.NET",那么点击时就会直接跳转到这个链接的页面。

    2、URL为相对URL

     此时指向站点内的某个文件，比如href="/test.doc"，那么点击时就会直接下载文件。

    3、锚 URL

       此时指向页面中的锚，比如href="#top"，那么点击时就会到当前页面中id="top"的这个锚点，实现当前页面的所谓跳转。用的最多就是在可滚动页面中，添加菜单，可以直接回到页面中的某个部分的内容。

即所有的三种代码样例：

 <a href="http://baidu.com">超链接</a> 
<a href="#">回到最顶端</a> 
<a href="css/css1.css">文件链接</a> 

总结

以上所述是小编给大家介绍的A标签中href=""的几种用法 ，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！

# a标签href  # 详解Html a标签中href和onclick用法、区别、优先级别  # 在JS中a标签加入单击事件屏蔽href跳转页面  # a标签的href与onclick事件的区别详解  # a标签click和href执行顺序探讨  # javascript和jquery修改a标签的href属性  # a标签的href和onclick 的事件的区别介绍  # ajax动态为a标签href赋值不执行跳转的原因分析及解决  # Jquery为a标签的href赋值实现代码  # A标签中通过href和onclick传递的this对象实现思路  # 这种方法  # 几种  # 时就  # 跳转  # 最重要  # 超链接  # 小编  # 是一个  # 这是  # 是在  # 最多  # 推荐使用  # 会在  # 很容易  # 给大家  # 三种  # 可以直接  # 会使  # 种方法  # 就来 

相关栏目： 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571 】

相关推荐： 网站制作大概多少钱一个,做一个平台网站大概多少钱？  Laravel Pest测试框架怎么用_从PHPUnit转向Pest的Laravel测试教程  Laravel中的withCount方法怎么高效统计关联模型数量  Python并发异常传播_错误处理解析【教程】  如何自己制作一个网站链接,如何制作一个企业网站，建设网站的基本步骤有哪些？  大连企业网站制作公司,大连2025企业社保缴费网上缴费流程？  消息称 OpenAI 正研发的神秘硬件设备或为智能笔，富士康代工  Zeus浏览器网页版官网入口 宙斯浏览器官网在线通道  WordPress 子目录安装中正确处理脚本路径的完整指南  Laravel怎么配置S3云存储驱动_Laravel集成阿里云OSS或AWS S3存储桶【教程】  EditPlus中的正则表达式 实战(2)  如何在云服务器上快速搭建个人网站？  Laravel Eloquent关联是什么_Laravel模型一对一与一对多关系精讲  Thinkphp 中 distinct 的用法解析  详解jQuery停止动画——stop()方法的使用  如何用花生壳三步快速搭建专属网站？  如何使用 Go 正则表达式精准提取括号内首个纯字母标识符（忽略数字与嵌套）  如何快速辨别茅台真假？关键步骤解析  郑州企业网站制作公司,郑州招聘网站有哪些？  edge浏览器无法安装扩展 edge浏览器插件安装失败【解决方法】  PHP正则匹配日期和时间(时间戳转换)的实例代码  Laravel Vite是做什么的_Laravel前端资源打包工具Vite配置与使用  标题：Vue + Vuex + JWT 身份认证的正确实践与常见误区解析  Laravel怎么进行数据库事务处理_Laravel DB Facade事务操作确保数据一致性  专业企业网站设计制作公司,如何理解商贸企业的统一配送和分销网络建设？  如何选择PHP开源工具快速搭建网站？  Laravel与Inertia.js怎么结合_使用Laravel和Inertia构建现代单页应用  Laravel如何实现一对一模型关联？（Eloquent示例）  Laravel如何处理CORS跨域问题_Laravel项目CORS配置与解决方案  智能起名网站制作软件有哪些,制作logo的软件？  html5audio标签播放结束怎么触发事件_onended回调方法【教程】  香港服务器WordPress建站指南：SEO优化与高效部署策略  Windows家庭版如何开启组策略(gpedit.msc)？（安装方法）  如何在Windows 2008云服务器安全搭建网站？  网站视频制作书签怎么做,ie浏览器怎么将网站固定在书签工具栏？  韩国代理服务器如何选？解析IP设置技巧与跨境访问优化指南  Laravel如何处理文件下载请求？（Response示例）  zabbix利用python脚本发送报警邮件的方法  如何快速使用云服务器搭建个人网站？  网站制作大概要多少钱一个,做一个平台网站大概多少钱？  香港网站服务器数量如何影响SEO优化效果？  Laravel队列任务超时怎么办_Laravel Queue Timeout设置详解  Laravel怎么集成Vue.js_Laravel Mix配置Vue开发环境  悟空浏览器如何设置小说背景色_悟空浏览器背景色设置【方法】  javascript和jQuery中的AJAX技术详解【包含AJAX各种跨域技术】  Google浏览器为什么这么卡 Google浏览器提速优化设置步骤【方法】  浅述节点的创建及常见功能的实现  实现点击下箭头变上箭头来回切换的两种方法【推荐】  HTML 中动态设置元素 name 属性的正确语法详解  用yum安装MySQLdb模块的步骤方法