“javascript:void(0)”是什么意思?

2022-08-29 21:59:40
<a href="javascript:void(0)" id="loginlink">login</a>

我见过很多次这样的,但我不知道这到底是什么意思。href


答案 1

运算符计算给定的表达式,然后返回 。voidundefined

运算符通常仅用于获取基元值,通常使用 “”(等效于 “”)。在这些情况下,可以改用未定义的全局变量(假设它尚未分配给非默认值)。voidundefinedvoid(0)void 0

这里提供了一个解释:void运算符

您希望使用链接执行此操作的原因是,通常,URL会将浏览器重定向到评估该JavaScript结果的纯文本版本。但是,如果结果是 ,则浏览器将保持在同一页面上。 只是一个简短而简单的脚本,其计算结果为 。hrefjavascript:undefinedvoid(0)undefined


答案 2

除了技术答案之外,还意味着作者做错了。javascript:void

没有充分的理由使用伪 URL(*)。在实践中,如果有人尝试“书签链接”,“在新选项卡中打开链接”等内容,则会导致混淆或错误。这种情况经常发生,现在人们已经习惯了中键点击新选项卡:它看起来像一个链接,你想在新选项卡中阅读它,但事实证明它根本不是一个真正的链接,并且在中键单击时给出不需要的结果,如空白页或JS错误。javascript:

<a href="#">是一种常见的替代方案,可以说是不那么糟糕。但是,您必须记住从事件处理程序中,以防止链接被跟踪并向上滚动到页面顶部。return falseonclick

在某些情况下,可能有一个实际有用的位置指向链接。例如,如果你有一个控件,你可以点击它打开一个以前隐藏的,用它来链接到它是有意义的。或者,如果有一种非JavaScript的方式可以做同样的事情(例如,“thispage.php?show=foo”将foo设置为可见),你可以链接到它。<div id="foo"><a href="#foo">

否则,如果链接仅指向某个脚本,则它不是真正的链接,不应标记为链接。通常的方法是将 添加到 、 或 不带 的 ,并以某种方式设置样式,以使其清楚您可以单击它。这就是StackOverflow[在撰写本文时所做的;现在它使用]。onclick<span><div><a>hrefhref="#"

这样做的缺点是您失去了键盘控制,因为您无法按 Tab 键进入 span/div/bare-a 或用空格激活它。这是否实际上是一个缺点取决于元素打算采取什么样的行动。您可以尝试通过向元素添加 a 并侦听空格键来模拟键盘的交互性。但它永远不会100%重现真实的浏览器行为,尤其是因为不同的浏览器可以以不同的方式响应键盘(更不用说非视觉浏览器了)。tabIndex

如果你真的想要一个不是链接的元素,但它可以通过鼠标或键盘正常激活,你想要的是一个(或者同样好,对于简单的文本内容)。如果需要,您可以随时使用CSS来重新设置其样式,使其看起来更像是链接而不是按钮。但是,由于它的行为就像一个按钮,因此您实际上应该如何标记它。<button type="button"><input type="button">

(*:无论如何,在网站创作中。显然,它们对于书签很有用。 伪 URL 是一种概念上的怪异:定位器不指向某个位置,而是调用当前位置内的活动代码。它们给浏览器和Web应用程序都带来了巨大的安全问题,不应该被Netscape发明。javascript: