js中a标签的href属性不跳转方法

在使用javascript伪协议的时候：

javascript: 是一个伪协议，其他的伪协议还有 mail:  tel:  file:  等等。
<a id="jsPswEdit" class="set-item" href="javascript:;">修改密码</a>
javascript:是表示在触发<a>默认动作时，执行一段JavaScript代码，而 javascript:; 表示什么都不执行，这样点击<a>时就没有任何反应。
一般在这种情况下，会给<a>绑定一个事件回调，来执行业务，如：
document.getElementById('jsPswEdit').addEventListener('click', function(e) {
  e.preventDefault();

// 当<a>触发click时，处理业务
}, false);

下面是整理的a标签的href属性的用法：

1.超链接

<a href="http://www.baidu.com" >百度一下</a> 这种事<a></a>标签的最常用的用法，超链接到一个页面

2.锚点：

定位到当前页面顶端：

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

定位到当前页面的指定位置：

<a href="#001">跳到001</a>
...文字省略
<a name="001" id="001" ></a>
...文字省略

其实锚点只需name就可以可，加id是为了让它兼容性更好.
href的值要跟name \ i d 一致，前面必须加"#"，以上代码在ie6/7,ff中都可以兼容，但在ie8中就不行。
因为我们锚点的<a></a>值为空，为不影响美观我们加个空格就行了,

如以下代码，就可以兼容ie8
<a href="#001">跳到001</a>
...文字省略
<a name="001" id="001" > </a>
...文字省略

定位到其他页面:

a href="123.html#001">跳到001</a>
...文字省略
<a name="001" id="001" > </a>
...文字省略

例子：代码如下
<a name="A0" id="A0"></a>
<a href="#A1">网页第一部分</a>
<a href="#A2">网页第二部分</a>
<div style="height:900px; background:#CCCCCC"></div>
<a name="A1" id="A1"></a>1<a href="#A0">返回顶部</a>
<div style="height:900px; background:#999999"></div>
<a name="A2" id="A2"></a>2<a href="#A0">返回顶部</a>
<div style="height:900px; background:#666666"></div>

3. href不跳转

a href="javascript:void(0);" οnclick="js_method()"

这种方法是很多网站最常用的方法，也是最周全的方法，onclick方法负责执行js函数，而void是一个操作符，void(0)返回undefined，地址不发生跳转。而且这种方法不会像第一种方法一样直接将js方法暴露在浏览器的状态栏。
a href="javascript:;" οnclick="js_method()"
这种方法跟跟2种类似，区别只是执行了一条空的js代码。
a href="#" οnclick="js_method()"
这种方法也是网上很常见的代码，#是标签内置的一个方法，代表top的作用。所以用这种方法点击后网页后返回到页面的最顶端。
a href="#" οnclick="js_method();return false;"
这种方法点击执行了js函数后return false，页面不发生跳转，执行后还是在页面的当前位置。

综上：所以想实现在<a href=>中调用js推荐使用：

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