没有href属性的锚标签是否安全?

问题描述 投票:215回答:9

是否可以使用锚标记而不包含href属性,而是使用JavaScript单击事件处理程序?所以我会完全省略href,甚至没有空(href="")。

html hyperlink standards anchor
9个回答
204
投票

在HTML5中,使用不带a属性的href元素是有效的。它被认为是“占位符超链接”。

例:

<a>previous</a>

在w3c锚标记参考页面上查找“占位符超链接”:https://www.w3.org/TR/2016/REC-html51-20161101/textlevel-semantics.html#the-a-element

它也在维基上提到:https://www.w3.org/wiki/Elements/a

占位符链接适用于您要使用锚元素但不能在任何位置导航的情况。这对于在导航菜单或面包屑路径中标记当前页面非常方便。 (旧方法可能是使用span标记或带有名为“active”或“current”的类的锚标记来设置样式,使用JavaScript来取消导航。)

如果您希望在运行时通过JavaScript动态设置链接的目标,则占位符链接也很有用。您只需设置href属性的值,锚标记就变为可点击。

也可以看看:


34
投票

没关系,但同时会导致某些浏览器变慢。

http://webdesignfan.com/yslow-tutorial-part-2-of-3-reducing-server-calls/

我的建议是使用<a href="#"> </a>

如果您正在使用JQuery,请记住也使用:

.click(function(event){
    event.preventDefault();
    // Click code here...
});

24
投票

简答:不。

答案很长:

首先,没有href属性,它将不是链接。如果它不是链接,那么它不会是键盘(或呼吸开关,或其他各种非基于指针的输入设备)可访问(除非您使用tabindex的HTML 5功能,这些功能并非普遍支持)。控件没有键盘访问是非常罕见的。

第二。你应该有一个替代方案,当JavaScript没有运行时(因为它从服务器加载缓慢,互联网连接被丢弃(例如移动火车上的移动信号),JS被关闭等等)。

利用progressive enhancementunobtrusive JS.


20
投票

如果必须使用href来实现向后兼容性,也可以使用

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

而不是#,如果你不想使用该属性


12
投票

没有href属性就可以使用标签。与此处的许多答案相反,实际上有标准原因在没有href时创建锚点。在语义上,“a”表示锚或链接。如果你将它用于那些意义之后的任何东西,那么你没事。

没有href的标签的一个标准用途是创建命名链接。这允许您使用名称= blah的锚点,稍后您可以使用href =#blah创建锚点以链接到当前页面的命名部分。但是,这已被弃用,因为您也可以以相同的方式使用ID。例如,您可以使用带有id = header的标头标记,稍后您可以使用指向href = #head的锚点。

但是,我的观点是不建议使用name属性。只提供一个不需要href的用例,并因此推断出为什么不需要它。


8
投票

从可访问性的角度来看,<a>没有href是不可制表的,所有链接都应该是可制表的,所以如果没有href,请添加tabindex ='0“。


7
投票

使用多级菜单时,没有“href”的<a>标签可以很方便,您需要扩展下一级别但不希望该菜单标签成为活动链接。我从来没有遇到任何问题。


0
投票

在某些浏览器中,如果您没有提供href属性,则会遇到问题。我建议你写一下这样的代码:

<a href="#" onclick="yourcode();return false;">Link</a>

你可以用自己的函数或逻辑替换你的code(),但要记得添加return false;最后的声明。

© www.soinside.com 2019 - 2024. All rights reserved.