"javascript:void(0)"是什么意思？

Question

<a href="javascript:void(0)" id="loginlink">login</a>

我见过href很多次,但我不知道究竟是什么意思.

Answer 1

的void运算符计算给定表达式,然后返回undefined.

的void操作者经常被用来仅获取undefined原始值,通常使用" void(0)"(这是相当于" void 0").在这些情况下,undefined 可以使用全局变量(假设它尚未分配给非默认值).

这里给出解释:void操作员.

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

Answer 2

除了技术答案,javascript:void意味着作者正在做错.

没有充分的理由使用javascript:伪URL(*).在实践中,如果有人尝试"书签链接","在新标签中打开链接"等内容,它将导致混淆或错误.这种情况发生了很多,现在人们已经习惯了中间点击换新标签:它看起来像一个链接,你想在新标签中读取它,但事实证明它根本不是真正的链接,并在中间点击时提供不需要的结果,如空白页面或JS错误.

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

在某些情况下,可能有一个实际有用的地方指向链接.例如,如果你有一个控件,你可以点击它打开一个以前隐藏的<div id="foo">,使用<a href="#foo">链接到它是有道理的.或者,如果有一种非JavaScript的方式做同样的事情(例如,'thispage.php？show = foo'设置foo开头可见),你可以链接到那个.

否则,如果链接仅指向某个脚本,则它实际上不是链接,不应该这样标记.通常的方法是将a添加onclick到a <span>,<div>或者<a>不添加,href并以某种方式对其进行样式化,以便明确可以单击它.这就是StackOverflow [在撰写本文时所做的; 现在它使用href="#"].

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

如果你真的想要一个不是链接但可以通过鼠标或键盘正常激活的元素,那么你想要的是一个<button type="button">(或者<input type="button">对于简单的文本内容来说同样好).如果你愿意的话,你总是可以使用CSS来重新设置它,使它看起来更像是一个链接,而不是一个按钮.但由于它的行为就像一个按钮,这就是你应该如何标记它.

(*:在网站创作中,无论如何.显然它们对于bookmarklet非常有用.javascript:伪URL是一个概念上的奇怪:一个定位器,它不指向一个位置,而是调用当前位置内的活动代码.它们引起了大量的安全性浏览器和Web应用程序都存在问题,而且不应该由Netscape发明.)

Answer 3

这意味着它什么都不做.这是尝试让链接无法在任何地方"导航".但这不是正确的方法.

你应该return false在onclick事件中,就像这样:

<a href="#" onclick="return false;">hello</a>

通常情况下,如果链接正在执行某些"JavaScript-y"操作,则会使用它.就像发布AJAX表单,或者交换图像一样.在这种情况下,你只需要将任何函数称为return false.

但是,为了使您的网站完全出色,通常您会包含一个执行相同操作的链接,如果浏览它的人选择不运行JavaScript.

<a href="backup_page_displaying_image.aspx"
   onclick="return coolImageDisplayFunction();">hello</a>

Answer 4

"#"与javascript:void的行为存在巨大差异

"#"滚动到页面的顶部,而"javascript:void(0);" 才不是.

如果您正在编写动态页面,这非常重要.用户不想仅仅因为他点击页面上的链接而返回顶部.

Answer 5

这是一种将JavaScript函数添加到HTML链接的非常流行的方法.
例如:[Print]您在许多网页上看到的链接都是这样写的:

<a href="javascript:void(0)" onclick="callPrintFunction()">Print</a>

我们为什么需要href而onclick单独可以完成这项工作？因为当用户将鼠标悬停在文本'Print'上时href,光标将变为插入符号(ꕯ)而不是指针(?).只有href在a标签上才会将其验证为超链接.

另一种选择href="javascript:void(0);"是使用href="#".此替代方案不需要在用户的浏览器中打开JavaScript,因此它更兼容.

Answer 6

你应该总是在你的标签上有一个href .调用返回'undefined'的JavaScript函数会很好.所以将链接到'#'.

没有href的Internet Explorer 6中的锚标记不会a:hover应用样式.

是的,它是可怕的,是一种针对人类的轻微犯罪,但一般来说,Internet Explorer 6也是如此.

我希望这有帮助.

Internet Explorer 6实际上是一种危害人类的重大犯罪.

Answer 7

值得一提的是,在检查undefined时有时会看到void 0,因为它需要更少的字符.

例如:

something === undefined

与

something === void 0

由于这个原因,一些缩小方法用void 0替换undefined.

Answer 8

void是一个用于返回undefined值的运算符,因此浏览器将无法加载新页面.

Web浏览器将尝试使用任何用作URL的内容并加载它,除非它是一个返回null的JavaScript函数.例如,如果我们点击这样的链接:

<a href="javascript: alert('Hello World')">Click Me</a>

然后会显示警报消息而不加载新页面,这是因为alert是一个返回空值的函数.这意味着当浏览器尝试加载新页面时,它会看到null并且无法加载任何内容.

关于void运算符的一个重要注意事项是它需要一个值,并且不能单独使用.我们应该像这样使用它:

<a href="javascript: void(0)">I am a useless link</a>

Answer 9

使用javascript:void(0)意味着HTML的作者滥用锚元素代替按钮元素.

锚点标记经常被onclick事件滥用,通过将href设置为"#"或"javascript:void(0)"来创建伪按钮,以防止页面刷新.复制/拖动链接,打开新选项卡/窗口中的链接,书签以及JavaScript仍在下载,错误输出或被禁用时,这些值会导致意外行为.这也向辅助技术(例如,屏幕阅读器)传达了不正确的语义.在这些情况下,建议使用<button>替代.通常,您应该只使用锚点来使用正确的URL进行导航.

资料来源:MDN的<a>页面.

Answer 10

要理解这个概念,首先应该理解JavaScript中的void运算符.

void运算符的语法是:void «expr»它计算expr并返回undefined.

如果将void实现为函数,则如下所示:

function myVoid(expr) {
    return undefined;
}

此void运算符有一个重要用法 - 丢弃表达式的结果.

在某些情况下,返回undefined而不是表达式的结果很重要.然后可以使用void来丢弃该结果.其中一种情况涉及javascript:URL,对于链接应避免使用,但对于bookmarklet非常有用.当您访问其中一个URL时,许多浏览器会将当前文档替换为评估URL"内容"的结果,但前提是结果未定义.因此,如果要在不更改当前显示内容的情况下打开新窗口,可以执行以下操作:

javascript:void window.open("http://example.com/")

Answer 11

据我所知，void运算符在 JavaScript 中有 3 种常见用途。您所指的一个是使标签成为无操作的<a href="javascript:void(0)">常见技巧。<a>某些浏览器会根据<a>标签是否具有 来不同地对待标签href，因此这是一种创建带有 的链接但href不执行任何操作的方法。

该void运算符是一个一元运算符，它接受一个参数并返回undefined。所以var x = void 42;意思是x === undefined。这很有用，因为在严格模式之外，undefined实际上是一个有效的变量名。因此一些 JavaScript 开发人员使用void 0而不是undefined. 理论上，您也可以<a href="javascript:undefined">这样做，并且效果与 相同void(0)。

Answer 12

的void运算符计算给定表达式,然后返回未定义.它避免刷新页面.

Answer 13

Web开发人员javascript:void(0)之所以使用它，是因为它是防止a标记默认行为的最简单方法。void(*anything*)返回undefined，这是一个虚假的值。并返回假值，就像return false在标记onclick事件中a阻止其默认行为一样。

因此，我认为这javascript:void(0)是防止a标记默认行为的最简单方法。

Answer 14

链接必须具有要指定的HREF目标，才能使其成为可用的显示对象。

大多数浏览器不会在

<A HREF="" 

标签，例如：

<A href="JavaScript:var elem = document.getElementById('foo');" 

因为大多数浏览器中的HREF标记都不允许空格，或者会将空格转换为％20（相当于SPACE的十六进制），这使得JavaScript绝对对解释器毫无用处。

因此，如果要使用A HREF标签执行内联JavaScript，则必须为HREF FIRST指定一个不太复杂（不包含空格）的有效值，然后在事件属性标签（如OnClick）中提供JavaScript ，OnMouseOver，OnMouseOut等。

典型的答案是做这样的事情：

<A HREF="#" onclick="var elem = document.getElementById('foo');">Get the object</a>

这可以正常工作，但是由于井号/井号标记告诉它这样做，所以它使页面跳到顶部。

只需在A HREF标签中提供井号/哈希标签即可实际指定根锚，默认情况下，根锚始终位于页面顶部，您可以通过在A HREF标签内指定NAME属性来指定其他位置。

<A NAME='middleofpage'></A>

然后，您可以将A HREF标记更改为跳转到“ middleofpage”并在OnClick事件中执行JavaScript，如下所示：

<A HREF="#middleofpage" onclick="var elem = document.getElementById('foo');">Get the object</a>

在很多时候，您都不希望该链接跳来跳去，因此您可以做两件事：

<A HREF="#thislinkname" name='thislinkname' onclick="var elem = document.getElementById('foo');">Get the object</a>

现在单击时将无处可去，但是它可能导致页面从当前视口重新居中。不好看 什么是使用A HREF提供内联JavaScript的最佳方法，而无需执行上述任何操作？JavaScript：无效（0）;

<A HREF="JavaScript:void(0);" onclick="var elem = document.getElementById('foo');">Get the object</a>

这告诉浏览器现在不运行，而是执行有效的JavaScript：void（0）;。首先在HREF标记中起作用，因为它不包含空格，也不会被解析为URL。相反，它将由编译器运行。VOID是一个关键字，当提供0的性能参数时，它返回UNDEFINED，它不使用更多的资源来处理不指定0就会出现的返回值（它对内存管理/性能更友好）。

接下来发生的事情是执行OnClick。页面不会移动，在显示方面不会发生任何事情。