为什么要用href="javascript:void(0);"

我们经常在a标签中看到,那:void(0);到底是什么意思呢？

html标签中的自有属性的行为是默认的，如果使用:void(0);就可以取消自有属性跳转的默认行为，相当于event.();

我们对a标签的href进行一下扩展，和:void(0);有什么区别呢？

在学习html的时候，大家一定针对标签的锚点有过了解。比如一个pc端页面很长，通过点击一个按钮可以跳到页面的某个位置，这时候我们熟悉的锚点会出现在脑海中，我们会用到它。

<a href=“#contact”>联系我们</a>

<div id="contact">联系我们的内容</div>

点击“联系我们”，就一下子就跳到了#这个元素。但经过很多工程师的实际测试，锚点的方法在有些移动端设备上是无法跳转的。因此锚点的兼容性问题，也算手机端无数个坑之中其中之一吧。

怎么办？怎么办？

我们试试用这样的方法，首先使用:void(0);然后在用js的方法让它进行页面内部的跳转。

$("a").click(function(){
  $('body,html').animate({scrollTop: $("#contact").offset().top});
});

这样一样可以完成跳转，而且不会出现有些移动端页面跳转失效的情况。等等，是不是太生硬了？闪了一下就跳过去了。确实用户体验不太好，那我们完善一下。

$("a").click(function(){
  $('body,html').animate({scrollTop: $("#contact").offset().top}，100);
});

加上100毫秒href，是不是好很多了？大家自己可以按照实际的需要改变时间的长度。

今天小六分享的内容href，各位前端客们get到了么？

欢迎更多前端客们加入进来，对每天推送的内容进行点评、纠错，如果你有想要与大家分享的前端技巧，欢迎给前端客投稿（投稿地址：）。

本微信号所有内容为前端客用户原创，前端客已获得独家授权，欢迎分享。

如有转载需求请留言征询，对于未经许可私自篡改内容、转载的行为我们保留追究维权的合法权利！

前 端 客

简 单 高 效

限时特惠:本站持续每日更新海量各大内部创业课程，一年会员仅需要98元，全站资源免费下载
点击查看详情

站长微信:Jiucxh