javascript - 如何在 JavaScript 中获取“原始”href 内容

Question

我正在尝试编写一个 GreaseMonkey 脚本，我想在其中找到所有相对链接的链接。在我看来，这样做的方法是将 href 的内容与/^https?:///.

但是我发现当我访问锚的 href 属性时，它总是被规范化或煮熟成包含“http”的形式。也就是说，如果 HTML 包含：

<a id="rel" href="/relative/link">inner</a>

访问

document.getElementById("rel").href

返回

http://example.com/relative/link

如何访问 href 属性中的原始数据？

或者，是否有更好的方法来查找相对链接？

Answer 1

试试这个getAttribute方法。

Answer 2

典型的。发布问题后，我几乎立即自己弄清楚了。

代替：

anchor.href

采用：

anchor.getAttribute("href")

当然，我输入这个答案比其他人回答它花费的时间更长。（该死的，你们这些人速度很快。）

Answer 3

这是您可以运行来测试的代码片段。

const anchors = document.getElementsByTagName('a');

for (let anchor of anchors) {
  let hrefFullPath = anchor.href;
  let hrefRelativePath = anchor.attributes.href.value;

  console.log('hrefFullPath', hrefFullPath);
  console.log('hrefRelativePath', hrefRelativePath);
}

假设您在http://localhost:4200，这是您在问题中显示的文档。

<a id="rel" href="/relative/link">inner</a>

这个锚点的属性值为href：

document.getElementById('rel').attributes.href.value => /relative/link

而anchor的href价值是：

document.getElementById('rel').href =>  http://localhost:4200/relative/link

我希望它有所帮助。