JavaScript中javascript:void(0)的作用与用法详解

javascript:void(0)的作用与背景

在网页开发过程中，若需创建一个点击后不执行默认跳转操作的链接，或希望点击后触发其他特定行为，通常会将链接的 href 属性设置为 "#"。然而，这种做法存在一个明显的缺陷：当页面包含滚动条时，点击该链接会导致页面自动滚动至顶部或跳转至指定的锚点位置，从而破坏用户体验。

针对上述问题，一种常见的解决方案是使用 javascript:void(0)。

 
<a href="javascript:void(0)">单击此处看看效果</a>

执行上述代码后，点击链接不会发生任何页面跳转。这里的 javascript:void(0); 是一种 JavaScript 伪协议，其含义是明确指示链接不导向任何页面或位置。

javascript:void(0)的常见用法

在实际应用中，使用 javascript:void(0) 的形式主要有以下几种：

 
// 点击链接后不执行任何默认操作
<a href="javascript:void(0);" >test</a>
<a href="javascript:;" >test</a>
<a href="####" >test</a> // 常见写法为使用2到4个#号，例如"####"，也有使用"#all"等其他变体

 
// 点击链接后，响应用户自定义的点击事件
<a href="javascript:void(0)" onclick="doSomething()">test</a>