使用href和onclick的链接有什么区别？

Question

的所有人。我对编程和语言知之甚少，我在HTML上只有一些基础知识，所以我希望有人可以帮助我理解以下两行之间的区别：

<a onclick="window.location.href='http://www.example.com'">Click here</a>

<a href="http://www.example.com">Click here</a>

两者似乎完全相同，但我不确定在所有情况下是否都不是这样，即使用不同的浏览器，HTML / HTML5等。

任何帮助将不胜感激。感谢。

Answer 1

  

以下两行之间的差异

唯一的区别是您使用JavaScript重定向而不是内置浏览器功能。

请参阅W3C Specification了解链接

Answer 2

1)<a onclick="window.location.href='http://www.example.com'">Click here</a>

2)<a href="http://www.example.com">Click here</a>

在这种情况下，两个提供的浏览器支持javascript没有区别，并且页面和浏览器中没有JS错误。但是使用onclick，您可以通过点击执行不同的操作。例如：

2)<a href="http://www.example.com" onclick="return doSomething(this)">Click here</a>
...
function doSomething(elem){
//do something with url
return false;//do not open url
}

Answer 3

有许多不同之处。其中一些与可访问性有关，其中一些与UX有关。

• 如果没有href，浏览器就不会将链接设置为看起来像链接（因为它不是链接）。
• 如果没有href，则链接不在页面的Tab键顺序中（对于那些使用键盘快速遍历页面的人）。
• 如果没有href，您依赖JavaScript，如果其他地方出现错误，则可能会出现问题。
• 它促进使用<a>作为除导航之外的其他内容的处理程序，例如隐藏/显示页面的位，<button>更合适。
在所有情况下，所有浏览器都支持
• <a href>。
• 屏幕阅读器可能不会宣布没有href属性的链接，实际上使其无法用于许多用户（这也具有法律含义）。

只需使用href，因为它可以在任何地方使用，并免费为您提供辅助功能。