我应该使用点击而不是 href 吗？

Question

我的导航栏侧面和水平方向上的项目很少。每个项目都包含不同页面的 link。我读过几篇关于 href 属性的文章。对于应该使用什么有很多不同的意见，特别是在 HTML5 中，因为 href 不是必需的。如果可能的话，我想隐藏 link。其中一种选择是使用 onClick 函数。关于是否应该有 javascript 或 # 符号也有很大的争论。例如：

选项 1

<a href="#" onclick="someFunction(e)"></a>

或选项 2

<a href="javascript:void(0);" onclick="someFunction(e)">

我想知道这是否是解决此问题的最佳方法。我还看到很少有涉及 JQuery 的选项，但我不确定这是否是最佳选择。如果有人可以提供帮助，请告诉我。我只想使用经过良好测试的东西，这将是一个长期的解决方案。提前致谢。

Answer 1

如果您实际上是 link 使用 URL... 访问另一个 HTML 页面，则使用 link 元素和 href。

如果您在某个框架中并更改路线或视图 - 或者触发某些事件 - 这取决于您。如果需要，您可以使用按钮或任何元素或 <a>，但您必须确保防止 link.

的默认行为

听起来你的问题不在 href 或 none 之间 - 但在 link 或其他东西之间。

常规link

<a href='http://sheriffderek.consulting' target='sheriff'>link</a>

非javascript 网站的后备link？（不太可能在 2017 年除非你是 public 图书馆之类的）...

<a href='http://sheriffderek.consulting' onclick='someFunction(e)'>js view trigger with fallback link</a>

另一个元素

<button onclick="someFunction(e)">button</button>

此外 - 这取决于框架。我相信 Angular 只是说要使用 link 但不要使用 href。

Answer 2

如今，我看到大多数开发人员更喜欢“#”而不是 "javascript:"。

如果我必须使用 onclick，我个人会这样做：

<a href="#" onclick="event.preventDefault(); someFunction();">Link</a>

另一个例子：

<a href="#" onclick="someFunction(event);">Link</a>
<script>
    someFunction = function(event) { 
        event.preventDefault();
        // do the work
    }
</script>

为了回答您的一个问题，在页面中显示链接不应该是一个安全问题。每个服务器请求都必须防止未经授权的调用，URL混淆几乎毫无帮助。

Answer 3

您用于重定向页面（或调用事件）的方法实际上取决于您尝试通过该操作实现的目标和整体用户体验。有些情况下 href 更合适：

图像也是 link
用作 link
您想要向用户显示的实际 link

可以对按钮的 onClick 事件进行编码，以实现相同的效果，但路由不同。也许代码会更有效，或者通过按钮单击事件比仅仅使用 href 可以改善用户体验。

要牢记的两个主要事项是用户体验和设计，然后是页面的安全性。始终确保任何 link/redirection 都不会危及页面的安全。这可能会决定您需要使用的方法。

有关其他信息，您可以先阅读以下内容 link，然后继续阅读网站的其余堆栈交换 UX 部分：

希望对您有所帮助。

Action in href or onClick event?

我应该使用点击而不是 href 吗？

Should I use on click instead of href?

html

javascript

jquery

href