Html 有效使用<；a>；（锚定标记）没有href属性？

我一直在使用TwitterBootstrap构建一个站点，它的很多功能都依赖于在

中包装东西，即使它们只是执行Javascript。我在Bootstrap文档推荐的

href=“#”

策略方面遇到了问题，所以我试图找到一个不同的解决方案

但后来我尝试完全删除

href

属性。我一直在使用

，并让Javascript处理其余部分。它是有效的

---

但有些事告诉我我不应该这么做。对吗？我的意思是，从技术上讲，

应该是指向某个东西的链接，但我不完全确定这是一个问题。或者是吗？

我想你可以在这里找到答案：

此外，如果您想使用href进行无链接操作，您可以使用如下方式：

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

这个

就语义和样式而言，


通知用户特定元素被视为按钮，作为底层元素可能具有的任何语义的覆盖

对于
和
元素，您可能希望为空格添加JavaScript键侦听器，或者输入以触发
单击
事件<默认情况下，代码>
和
元素会执行此操作，但非按钮元素不会执行此操作。有时，将
单击
触发器绑定到不同的键更有意义。例如，web应用中的“帮助”按钮可能绑定到F1。
是的，使用锚定标记而不使用
href
属性是有效的

如果
a
元素没有
href
属性，则该元素表示
链接可能放置在的位置的占位符，如果
是相关的，只包含元素的内容

是的，您可以使用
类
和其他属性，但不能使用
目标
、
下载
、
rel
、
hreflang
和
类型

目标
、
下载
、
rel
、
hreflang
和
类型
属性必须是
如果href属性不存在，则省略

至于“我该不该？”部分，请参见第一条引文：“如果链接是相关的，可能会被放置在哪里”。所以我会问“如果我没有JavaScript，我会使用这个标签作为链接吗？”。如果答案为是，则是，您应该使用
和（例如，没有下划线、没有指针光标、没有
：链接）

来源：
它是有效的。例如，您可以使用它来显示模态（或响应
数据切换
和
数据目标
属性的类似内容）

比如：

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



在这里，我使用字体awesome图标来显示模式，它作为
a
标记比作为
按钮更好。另外，设置
role=“button”
将指针更改为动作类型。如果没有
href
或
role=“button”
，光标指针不会改变。
@zacquary，
[role=“button”]
没有做任何具体的事情，您仍然需要监听click事件（但无论如何，您都可以这样做来制作JS按钮）。它用于辅助导航（也称为屏幕阅读器），以便屏幕阅读器知道如何将元素表示为按钮，而不是其原始语义值。添加
[tabindex]
将元素添加到选项卡顺序中。在特殊情况下，您可能实际上不希望/不需要按钮在选项卡顺序中可导航，因此它是一个可选属性。已经是按钮的元素不需要
[role=“button”]
，因为它是多余的。没有href和name的锚定标记是否有效？在我们的应用程序中，我们有一些删除链接被禁用（因此没有href属性），但仍然显示给用户。@JoshuaMuheim，我希望你不介意，但是。只是想添加一个说明，如果你使用它来创建javascript操作的“按钮”。。。完全删除href属性还会导致Chrome（可能还有其他浏览器）停止在鼠标上方更改光标。显然，这很容易用CSS添加回去，但只是一个开头。@Mir，如果你不打算使用
[href]
，你可能应该使用
作为按钮。实际上应该是
javascript:undefined
@rybo111你是对的，但我仍然喜欢void（0）；基本上是因为它看起来更好。我不喜欢我的客户认为事情是“未定义的”；-）<代码>
？
javascript:用于破坏IE6中的滚动效果甚至gif动画。对于无链接操作，有专门的HTML元素，如
按钮
。同时，如果JS失败，像AJAX链接这样的东西可能会使用它们的
href
s来执行回退操作。在这种情况下，可能会重复使用按钮。从语义和可访问性的角度来看，它更合适。锚应该带你去某个地方，而不是执行某个动作。另外，为什么要用
aria hidden
隐藏整个锚点？可能是图标，但屏幕阅读器用户不应该减少体验。与其说是“边缘案例语义”，还不如说是关于可访问性，即确保残疾人能够使用和理解网站的内容
<a role="button" data-toggle="modal" data-target=".bs-example-modal-sm" aria-hidden="true"><i class="fa fa-phone"></i></a>