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

2019-05-13 23:30发布

我一直在使用Twitter的引导,以建立一个网站,和它的许多功能取决于包装东西<a> ,即使他们只是要执行JavaScript。 我已经受够了这些问题href="#"是引导的文档建议的战术,所以我试图找到不同的解决方案。

但后来我尝试了去除href干脆属性。 我一直在使用<a class='bunch of classes' data-whatever='data'> ,且使用Javascript处理其余部分。 和它的作品。

然而,有些事情在告诉我,我不应该这样做。 对? 我的意思是,在技术上<a>被认为是对的东西联系,但我不完全知道为什么这是一个问题。 是这样吗?

Answer 1:

所述<a> nchor元件仅仅是一个锚,或从一些内容。 最初允许命名锚(HTML规范<a name="foo"> )和链接锚( <a href="#foo"> )。

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

至于语义和造型而言, <a>元素不是链路( :link ),除非它有一个[href]属性。 这方面的一个副作用是,一个<a>而不元件[href]不会在默认情况下,跳位顺序。

真正的问题是是否<a>单独元件是一个适当的表示<button> 。 在语义层次,有一个显着的不同link和一个button

A键是什么,点击时会导致发生的操作。

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

由于链接是一种特殊类型的按钮,他们往往不得不自己的行动改写履行替代的功能。 接下来,如一个按钮是从一致性的观点来看确定使用锚,虽然它不是很准确的语义。

如果你担心的语义和使用的无障碍<a>元素(或<span><div>作为一个按钮,你应该添加以下属性:

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

该按钮的作用告诉该特定元素被视为一个按钮作为用于任何语义底层元件可能有一个覆盖该用户。

对于<span><div>元素,你可能需要添加JavaScript的按键侦听空间输入触发click事件。 <a href><button>元素默认做到这一点,但非按钮元素没有。 有时,它使更多的结合感click触发不同的密钥。 例如,在一个网络应用程序中的“帮助”按钮可以绑定到F1。



Answer 2:

我想你可以在这里找到答案: 在没有将href锚标记属性安全吗?

此外,如果你想与HREF没有链接操作,您可以使用它像:

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


Answer 3:

是的,它是有效使用锚标签没有href属性。

如果a元素没有href属性,则该元素代表了其中的链接,否则可能已被放置,如果那是相关的,包括刚刚元素的内容的占位符。

是的,你可以使用class和其他属性, 但不能使用targetdownloadrelhreflangtype

targetdownloadrelhreflang ,和type如果href属性不存在的属性必须被省略。

至于“?我应该 ”的一部分,看到的第一个引文:“ 哪里的链接,否则可能已被放置,如果它已经相关的 ”。 所以,我会问:“ 如果我没有JavaScript的,我会用这个标签作为一个链接?”。 如果答案是肯定的那么,你应该使用<a>没有href 。 如果没有的话,我仍然会使用它,因为生产率是我比边缘情况语义更重要,但这只是我个人的意见。

另外,你应该注意不同的行为和样式 (例如,没有下划线,没有指针光标,而不是一个:link )。

来源: W3C HTML5推荐



Answer 4:

它是有效的。 你可以,例如,用它来显示(即响应或类似的事情模态data-toggledata-target属性)。

就像是:

<a role="button" data-toggle="modal" data-target=".bs-example-modal-sm" aria-hidden="true"><i class="fa fa-phone"></i></a>

在这里,我使用的字体-真棒图标,这是作为一个更好的a标签,而不是一个button ,显示一个模式。 此外,设置role="button" ,使指针改变到动作类型。 没有任何hrefrole="button" ,将光标指针不会改变。



文章来源: Valid to use (anchor tag) without href attribute?