阻止a标签跳转的方法_a标签禁止跳转

​ 通常使用a标签是为了做跳转，有时候我们也可以拿来做点击的效果，但需要阻止它跳转，因此引申出以下的几种方法：

• (推荐）href里写 javascript: 这个是最常用的方法，京东也是使用该方法，这里是的意思是这次点击又JavaScript处理，处理的方式是无/伪协议，如果我们后面写个alert() 就代表alert()处理，其次写其他也一样

  <a href="javascript:">点击</a>
  <a href="javascript:void(0)">点击</a>
  1
  2

• (推荐）onclick事件返回false，直接做截断了，后面不会执行

  <a href="http://www.baidu.com" onclick="return false">点击</a>
  1

• (推荐）@click.prevent 阻止事件的默认行为，href必须为空

  // 案例1：
  <a href="" @click.prevent>点击</a>
  // 案例2：
  <a href="http://www.baidu.com" >点击</a>
  let a = document.querySelector('a')
  a.onclick = function(e){
  	e.preventDefault()
    }
  1
  2
  3
  4
  5
  6
  7
  8

• (不推荐）使用 (#)

  总是跳转到当前页面顶部，当页面内容较多时，还是会有跳转的感觉。

  <a href="#">点击</a>
  1