空的href有效吗?

mat*_*hew 167 html href

我们的一位Web开发人员使用以下html作为占位符来设置下拉列表的样式.

<a href="" class="arrow"></a>
Run Code Online (Sandbox Code Playgroud)

这被认为是锚标签有效吗?

由于没有href值,它在我们的一些链接检查器报告中显示为已损坏.

SLa*_*aks 176

这是有效的.

但是,标准做法是使用href="#"或有时使用href="javascript:;".

  • 当我点击`href ="#"`时,焦点移动到IE的页面顶部,所以我想知道`href ="javascript :;"`更好 (29认同)
  • href ="#"是一种反模式.它为浏览器历史记录添加了一个额外的条目,并且在某些情况下使浏览器滚动到顶部,如果您不使用它,则可以省略href属性.它将默认为"",因此如果不加以阻止,则重新加载页面. (29认同)
  • 如RFC 2396中所述:不包含URI的URI引用是对当前文档的引用.换句话说,文档中的空URI引用被解释为对该文档开头的引用, (23认同)
  • @tosh,不,我很确定如果省略href属性,<a>元素没有被设置为链接样式,不可聚焦,并且不会创建<a href =""的链接>或<a href>.如果它对您有用,您可以共享一个显示它的JSFiddle吗? (15认同)
  • @tosh,你知道什么有趣吗?显然,自HTML5以来,省略该属性应该是这样的,请参阅http://www.w3.org/TR/html5/text-level-semantics.html#the-a-element(感谢halfdan提交下面的答案.)显然这还没有被供应商实现,并且由于它仍然只是候选推荐,很难说它是否会保留在最终标准中,或者供应商是否会在此之前遵守. (4认同)
  • @n2liquid-GuilhermeVieira 非常感谢您的精确。我并不是说省略 href 属性就是解决方案。我没有说对。我打算使用空字符串作为 href 属性值。 (2认同)

UpT*_*eek 110

正如其他人所说,它是有效的.

但每种方法都有一些缺点:

href="#" 在浏览器历史记录中添加了一个额外的条目(例如,在回扣时会很烦人).

href="" 重新加载页面

href="javascript:;" 似乎没有任何问题(除了看起来凌乱和毫无意义) - 任何人都知道吗?

  • 另一个有趣的是href ="//:0",它不会向服务器发出请求,也不会留下任何历史记录. (20认同)
  • HREF: "的JavaScript :;" 正是我需要在Android和iOS网页浏览器中使用的东西 (5认同)
  • //:0使我的部分图片无法在Chrome中加载.似乎Chrome将其解释为接收取消命令. (2认同)
  • IE链接到文档上面的目录:http://stackoverflow.com/questions/7966791/empty-html-href-leads-to-directory-listing-in-ie (2认同)
  • 我还没有测试过这个,但我怀疑 href="javascript:;" 会违反禁止内联 JavaScript 的内容安全策略。如果您打算启用此策略,我会使用其中一种替代方案。 (2认同)

Nic*_*ick 56

虽然可能完全有效的HTML不包含href,特别是onclick处理程序,但有一些事情需要考虑:如果没有设置tabindex值,它将不能用于键盘.此外,使用Internet Explorer的屏幕阅读器软件无法访问,因为IE将通过可访问性界面报告任何没有href属性的锚元素不可聚焦,无论是否已设置tabindex.

因此,以下内容可能完全有效:

<a class="arrow">Link content</a>
Run Code Online (Sandbox Code Playgroud)

显式添加null-effect href属性要好得多

<a href="javascript:void(0);" class="arrow">Link content</a>
Run Code Online (Sandbox Code Playgroud)

为了获得所有用户的完全支持,如果您使用带有CSS的类来渲染图像,您还应该包含一些文本内容,例如title属性,以提供正在进行的文本描述.

<a href="javascript:void(0);" class="arrow" title="Go to linked content">Link content</a>
Run Code Online (Sandbox Code Playgroud)

  • 感谢您提到省略 `href` 会弄乱可访问性界面。 (2认同)
  • 我还想补充一点——从可访问性的角度来看——将“href”值设置为相对/绝对路径以外的任何值都会导致屏幕阅读器问题。避免使用井号/井号符号作为此问题的解决方法,因为它不适用于此问题。屏幕阅读器可能(目前 VoiceOver 会)宣布您的链接是[片段标识符](https://www.w3.org/2001/tag/2011/01/HashInURI-20110115)(链接到当前页面中的某个位置)从标准的角度来看也是有效的。参见https://www.w3.org/2001/tag/2011/01/HashInURI-20110115#NakedHash (2认同)

uno*_*nor 46

虽然这个问题已经得到解答(tl; dr:是的,空href值有效),但现有的答案都没有引用相关的规范.

空字符串不能是URI.但是,该href属性不仅将URI作为值,还将URI引用.空字符串可以是URI引用.

HTML 4.01

HTML 4.01 使用 RFC 2396,它在4.2节中说明.同文档参考文献(大胆强调我的):

不包含URI的URI引用是对当前文档的引用.换句话说,文档中的空URI引用被解释为对该文档的开头的引用,并且仅包含片段标识符的引用是对该文档的所标识的片段的引用.

RFC 2396已被RFC 3986(目前是IETF的URI标准)废弃,基本上也是如此.

HTML5

HTML5 使用(可能包含空格的有效URL有效URL)W3C的URL规范已停止使用.应该使用WHATWG的URL标准(参见最后一节).

HTML 5.1

HTML 5.1 使用(有效的URL可能由空格包围有效的URL)WHATWG的URL标准(参见下一节).

什么是HTML

WHATWG的HTML 使用(可能由空格包围有效URL)来自WHATWG的URL标准有效URL字符串的定义,其中它表示它可以是相对URL的片段字符串,其必须至少是相对URL字符串,它可以是一个路径相对方案的URL字符串,它是一个路径相对URL字符串,不是以后跟的方案字符串开头的:,它的定义是(粗体强调我的):

路径相对URL字符串必须是零个或多个URL路径段字符串,通过U + 002F(/)彼此分隔,而不是以U + 002F(/)开头.


hal*_*dan 26

当前的HTML5草案还允许完全省略href属性.

如果a元素没有href属性,那么该元素表示一个占位符,如果它已经相关,则表示链接可能放置在哪里.

回答你的问题:是的,这是有效的.

  • 是的,但是 - 在某些浏览器中,没有`href`的`<a>`元素被称为dirrefently.例如,":悬停"样式在Chrome中不起作用(和其他奇怪的东西) (4认同)

anr*_*ots 16

实际上,你可以把它留空(W3验证器不会抱怨).

将这个想法更进一步:省略="".这样做的好处是链接不被视为当前页面的锚点.

<a href>sth</a>
Run Code Online (Sandbox Code Playgroud)


Jam*_*lly 9

虽然W3的验证器可能不会抱怨空href属性,但当前的HTML5工作草案规定:

href对属性aarea元素的值必须是一个有效的URL用空格潜在的包围.

一个有效的URL是与相符的网址URL标准.现在URL标准有点令人困惑,但是没有任何地方说明URL可以是空字符串.

...这意味着空字符串不是有效的URL.

然而,HTML5工作草案继续指出:

注:href对属性aarea不需要的元素 ; 当这些元素没有href属性时,它们不会创建超链接.

这意味着我们可以简单地省略该href属性:

<a class="arrow"></a>
Run Code Online (Sandbox Code Playgroud)


Jas*_*son 8

提醒一句:

根据我的经验,省略该href属性会导致可访问性问题,因为键盘导航将忽略它,并且永远不会像href存在时那样给予焦点.手动将您的元素包含在tabindex中是一种解决方法.