我应该使用’＃’还是’javascript：void(0);’在我的空链接的href属性上

本文概述

• javascript：void(0)
• href =”＃”
• 结论与建议

如果你鼓励使用＃, 并防止出现默认行为(滚动到文档顶部), 则不可避免地会导致在onclick事件中使用该函数的return false值, 即：

<a href="#" onclick="return false;">Hey</a>
<!-- Or -->
<a href="#" id="link">Hey</a>    
<script>
    document.getElementById("link").addEventListener("click", function(){
        return false;
    }, false);
</script>

而且, 如果你改用javascript：void, 则不必像前面所说的那样在click事件上返回false, void(0)是可能的最小脚本, 其结果为未定义, 即：

<a href="javascript:void(0);">Hey</a>

与使用href =”＃”相同的效果, 更小, 更清晰。

javascript：void(0)

使用javascript：时, 在导航中, 已执行脚本的返回值(如果有)将成为浏览器中显示的新文档的内容。 JavaScript中的void运算符使表达式之后的返回值返回undefined, 从而阻止了此操作的发生。

你之所以要使用链接的href这样做是因为, 通常, 一个javascript：URL会将浏览器重定向到评估该JavaScript结果的纯文本版本。但是, 如果结果不确定, 则浏览器将停留在同一页面上。 void(0)只是可能的最小脚本, 其评估结果为未定义。

但是, javascript：void(0);违反了启用CSP的HTTPS上的内容安全策略。内容安全策略(CSP)是安全性的附加层, 有助于检测和缓解某些类型的攻击, 包括跨站点脚本(XSS)和数据注入攻击。这些攻击可用于从数据盗窃到站点损坏或恶意软件分发的所有方面。

因此, 如果你是标准的宗教开发人员, 则可能要使用href =”＃”而不是javascript：void来防止违反任何法律。

href =”＃”

哈希是最安全的, 以防万一你的用户禁用了Javascript。

你可以使用jQuery轻松解决文档中具有此值的所有链接：

$('a[href="#"]').click(function(e) {
    e.preventDefault ? e.preventDefault() : e.returnValue = false;
});

请注意, 你甚至可以直接在元素的onclick属性中直接返回false, 这将具有相同的效果：

<a href="#" onclick="return false;">Hey, i'll do nothing</a>

结论与建议

如果你想要原始, 精确和快速, 请使用javascript：void(0)。

使用href =”＃”并阻止javascript的默认事件成为标准关注者。

• 如果你的链接没有指向任何地方, 请不要使用<a>元素。使用<span>或其他合适的方法, 然后添加CSS(：hover)以根据需要设置样式。
• 演示内容不应与内容混在一起。这意味着没有javascript：action, 也没有onclick属性, 而是使用纯Javascript阻止默认事件。