小编典典

有效使用(锚标记)没有 href 属性?

all

我一直在使用 Twitter Bootstrap 来构建一个网站,它的很多功能都依赖于将东西包装在<a>. 我对href="#"Bootstrap
文档推荐的策略有疑问,所以我试图找到一个不同的解决方案。

但是后来我尝试完全删除该href属性。我一直在使用<a class='bunch of classes' data- whatever='data'>,并让 Javascript 处理其余部分。它有效。

然而有些东西告诉我我不应该这样做。正确的?我的意思是,从技术上讲,<a>它应该是一个链接,但我不完全确定 为什么 这是一个问题。或者是吗?


阅读 64

收藏
2022-06-30

共1个答案

小编典典

nchor<a>元素只是指向或来自某些内容的锚点。最初,HTML 规范允许命名锚 ( <a name="foo">) 和链接锚 ( <a href="#foo">)。

命名锚格式不太常用,因为片段标识符现在用于指定[id]属性(尽管为了向后兼容,您仍然可以指定[name]属性)。没有属性的<a>元素[href]仍然有效

就语义和样式而言,<a>元素不是链接 (
:link),除非它具有[href]属性。这样做的副作用是,默认情况下,没有的<a>元素不会[href]在跳位顺序中。

真正的问题是<a>元素本身是否是 a 的适当表示<button>link在语义层面上, a和 a之间有明显的区别button

按钮是单击时会导致动作发生的东西。

链接是导致当前文档导航发生变化的按钮。在片段标识符 ( ) 的情况下,发生的导航可能在文档内移动,或者在 url (
)#foo的情况下移动到新文档。/bar

由于链接是一种特殊类型的按钮,因此它们通常会覆盖其操作以执行替代功能。从一致性的角度来看,继续使用锚点作为按钮是可以的,尽管它在语义上不太准确。

如果您担心将<a>元素(或<span>,或<div>)用作按钮的语义和可访问性,则应添加以下属性:

<a role="button" tabindex="0" ...>...</a>

按钮角色告诉用户特定元素被视为按钮,作为底层元素可能具有的任何语义的覆盖。

对于<span><div>元素,您可能希望为事件添加 JavaScript 键侦听器SpaceEnter触发click事件。<a href><button>元素默认这样做,但非按钮元素不这样做。click有时将触发器绑定到不同的键更有意义。例如,Web
应用程序中的“帮助”按钮可能绑定到F1.

2022-06-30