Question

var a = document.querySelector("a");
console.log( a.href == a.getAttribute("href") ); //why false? (tested on chrome)

<a href="#hello">Link</a>

为什么输出错误？我的意思是，我知道.href正在返回整个网址，而.getAttribute()只返回实际写在html上的部分，这就是比较结果为假的原因。 但我想知道这是否符合规范，为什么。另外，我想知道这是否与其他任何属性一起发生。

Answer 1

href属性为您提供绝对路径，而getAttribute方法返回属性的确切值。

var a = document.querySelector("a");
alert( a.href + " " + a.getAttribute("href") ); // http://stacksnippets.net/js#hello #hello

<a href="#hello">Link</a>

Answer 2

该属性始终是完整网址的原因在specification：

href 类型 DOMString
链接资源的绝对URI [IETF RFC 2396]。

区别在于一个是属性（<a href="#hello">），另一个是属性（a.href）。属性等于标记中设置的任何值。该属性仅由属性初始化，但可以包含任何其他（“匹配”）值。设置属性会覆盖该属性，再次设置该属性会导致出现差异：

var a = document.querySelector('a');
a.href = a.href;
alert('Setting the property: ' + a.href + ' ' + a.getAttribute('href'));
a.setAttribute('href', '#goodbye');
alert('Setting the attribute: ' + a.href + ' ' + a.getAttribute('href'));

<a href="#hello">Link</a>

关于其他属性，例如，<link>元素的href属性/属性的行为方式相同：

alert(document.getElementById('lnk').href);

<link id="lnk" type="text/css" rel="stylesheet" href="some.css"></link>

Answer 3

getAttribute（）方法始终返回该属性的值。如果你想获得任何属性的任何值，你可以使用getAttribute方法。

虽然HREF属性总是返回链接Document的URL。因此，当您使用绝对路径时，两个结果可能有时相同，否则两者都返回不同。

为什么不同的e.currentTarget.href和.getAttribute（“href”）？

3 个答案: