在Web开发中，使用href="#"作为链接会导致点击后页面自动滚动至顶端，影响用户体验。本文探讨了利用javascript:void(0)、####等伪协议以及结合onclick事件与return false来阻止默认行为的方法，并分析了各方案的兼容性与最佳实践，旨在提供稳定且符合标准的链接交互解决方案。
链接点击导致页面滚顶的问题
在进行页面开发时，若需创建一个点击后不执行导航或仅触发其他自定义操作的链接，常见的做法是将href属性设置为"#"。然而，这种做法存在一个明显的缺陷：当页面包含滚动条时，点击该链接会导致页面瞬间滚动回顶部，从而造成较差的用户体验。
针对上述问题，目前主要有以下几种解决方案：
不执行导航操作的方案
1. 点击链接后不执行任何导航操作
具体实现代码如下：
<a href="javascript:void(0);" >test</a>
<a href="javascript:;" >test</a>
<a href="####" >test</a> //使用2个到4个#，见的大多是"####"，也有使用"#all"等其他的响应自定义点击事件的方案
2. 点击链接后，响应用户自定义的点击事件
具体实现代码如下：
<a href="javascript:void(0)" onclick="doSomething()">test</a>
<a href="#" onclick="doSomething();return false;">此方法可解决大部分问题，包括浏览器兼容性问题</a> //或者直接使用href=""
<a href="#" onclick="alert();event.returnValue=false;">test</a>方案分析与最佳实践
补充说明：
1. 对于javascript:void(0)这种伪协议，建议尽量减少使用。参考相关Web标准书籍可知，这通常不符合最佳实践（此处引用原文观点，暂作记录）。
2. 在链接的href属性中直接使用javascript:void(0)可能在IE浏览器中引发一些问题，例如导致GIF动画停止播放。因此，最安全的做法是使用“####”。为了防止点击链接后页面跳转到顶部，只需在onclick事件中返回false即可。
3. 如果仅仅希望鼠标悬停时显示手型光标，可以使用以下代码：
具体实现代码如下：
<span style="cursor:pointer" onclick="foo()">Click Me!</span>void是JavaScript中的一个操作符，其含义是：仅执行表达式，但不返回任何值。
void操作符的使用格式如下：
具体实现代码如下：
javascript:void (expression)
javascript:void expression为了保持良好的代码风格，建议使用第二种带有括号的写法。
我们可以使用void操作符来指定超级链接，例如javascript:void(document.form.submit())。该表达式会被计算，但不会在当前文档中加载任何内容。void(0)的计算结果为0，但在JavaScript中没有任何实际效果，因此<a href="javascript:void(0)">的效果与<a href="javascript:void(1)">的效果相同。
关键在于理解void是JavaScript自身的操作符，它表示只执行表达式，但没有返回值。
另外，页面自动回到顶端是因为"#"默认的锚点位置是top，所以会出现这种情况。