JavaScript:void(null) 运算符
根据字典,void 是指空的空间。该术语是指在编程中使用时不返回任何内容或空值。
阅读本文后,你将了解 JavaScript:void(0)
运算符。你还将了解 void
运算符,包括它是如何工作的,以及如何与 JavaScript:
链接 href
属性的伪 URL 一起使用。
JavaScript 中的 Void
关键字
术语 void 是指不返回任何内容的函数。这类似于显式返回 undefined
的 JavaScript 函数,如下面的代码所示。
function und() {
return undefined
}
und()
或者隐含地,就像下面的代码一样。
function und() {
}
und()
无论上述例程中使用的表达式和语句如何,都不会返回任何结果。
你现在应该了解 void 一词的含义。另一方面,JavaScript:void(0)
更复杂。
JavaScript 中的 JavaScript:void(0)
如果 JavaScript:void(0)
被拆分,你将拥有 JavaScript:
和 void(0)
。让我们仔细看看每个组件。
JavaScript:
Pseudo URL
就是所谓的。当浏览器将此值作为锚标记 href
值接收时,它会解释冒号 :
后的 JavaScript 代码,而不是将值视为引用路径。
例如,使用下面的代码。
<a href="javascript:console.log('javascript');alert('javascript')">Link</a>
当你运行上面的代码时,你会看到一个链接按钮出现;单击此按钮时会显示一个弹出窗口。结果如下面的屏幕截图所示。
如上所示,浏览器不会将 href
视为引用路径。相反,它被视为以分号分隔的 javascript:
之后开始的 JavaScript 代码。
void(0)
运算符
void 运算符分析表达式并在计算时返回 undefined
。例如,看下面的代码。
const result = void(1 + 1);
console.log(result);
// undefined should be returned
表达式 1 + 1
被计算,但结果是 undefined
。这是另一个支持这一点的例子。
<body>
<h1>Heading</h1>
<script>
void(document.body.style.backgroundColor = 'black',
document.body.style.color = 'white'
)
</script>
</body>
上面代码的结果是:
下面给出了如何编写此代码的另一个示例。
console.log(void(0) === undefined)
// true
结合 JavaScript:
和 void(0)
JavaScript 的 void
运算符计算一个表达式并返回一个 undefined
值。你可能会遇到使用 href="JavaScript:Void(0);
的 HTML 文档有时在 <a>
元素中。
将表达式插入网页时经常使用 JavaScript void
,这可能会产生不必要的副作用。
使用 JavaScript:Void(0)
可以消除不需要的副作用,因为它将返回 undefined
原始值。超链接是 JavaScript:Void(0)
的典型用法。
你可能需要从链接中调用一些 JavaScript。当你单击链接时,你的浏览器通常会打开一个新页面或刷新现有页面(取决于指定的 URL)。
如果你已将 JavaScript 附加到该链接,你可能不希望这种情况发生。你可能想使用 JavaScript:void(0)
来防止页面重新加载。
JavaScript:void(0)
的示例
想象一下,你有一个链接,只有在单击两次(双击)后才能工作并显示一条消息。如果你只单击一次,则不会发生任何事情。
ondblclick
事件处理程序可以提供双击代码。你可以使用 JavaScript:void(0);
在锚链接中,以避免网站通过单击刷新。
为此,请使用下面的代码。
<a href="JavaScript:void(0);" ondblclick="alert('Good Job!')">Double Click!</a>
运行上面的代码时会出现一个 Double Click
按钮。单击此按钮时,会出现一个弹出窗口,上面写着 Good Job!
你可以在下面的屏幕截图中看到结果。
它在 void
的帮助下通知浏览器不要返回任何内容或 undefined
。javascript:void(0)
引用的链接的另一个用例是链接可以在后台执行 JavaScript 代码,从而无需导航。
在这种情况下,表达式将作为参数提供给 void
。单击页面时,它不会导航另一个页面或重新加载当前页面。
通过阅读本文,你了解了 void
运算符是什么、它是如何工作的,以及如何在这个简短的教程中将它与链接的 href
属性的 javascript:
伪 URL 一起使用。