如何使用jQuery为我的href链接添加ID？

Question

所以，我认为这很简单，但是我找不到正确的解决方案。

实际上，我的链接看起来像这样：

<a href="/kfhdsh/kfhdh">Link 1</a>
<a href="/kfhdsh/kfhdh">Link 2</a>
<a href="/kfhdsh/kfhdh">Link 3</a>

如何自动添加相同的ID在链接后面？

就像这样：

<a href="/kfhdsh/kfhdh#ID">Link 1</a>
<a href="/kfhdsh/kfhdh#ID">Link 2</a>
<a href="/kfhdsh/kfhdh#ID">Link 3</a>

感谢任何帮助！

- Antonio

---

我在jQuery方面还不是最好的 - 你能给我一个简短的脚本吗？非常感谢！ - Antonio

Answer 1

你可以通过提供一个函数给 attr() 来实现。该函数将接受属性的当前值，然后您可以返回在追加 URL 片段后要使用的新值，例如：

```javascript $(selector).attr("href", function(i, val) { return val + "#section1"; }); ```

$('a').attr('href', function(i, href) {
  return href + '#ID';
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="/kfhdsh/kfhdh">Link 1</a>
<a href="/kfhdsh/kfhdh">Link 2</a>
<a href="/kfhdsh/kfhdh">Link 3</a>

请注意，您也可以使用 prop() 来实现此功能，但这里的重要区别在于 prop() 将把值转换为绝对 URL，而 attr() 则会保留相对路径。

- Rory McCrossan

---

10分钟内获得7个赞？？一定是一个受欢迎的问题。不过回答很好。 - Matt

@Antonio 没问题，很高兴能帮助。 - Rory McCrossan

Answer 2

这是你想要的吗？

$().ready(function() {
  $("a.link").attr("href", $("a.link").attr("href") + "#ID")
})

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

<a class="link" href="/kfhdsh/kfhdh">Link 1</a>
<a class="link" href="/kfhdsh/kfhdh">Link 2</a>
<a class="link" href="/kfhdsh/kfhdh">Link 3</a>

- wowo

---

请注意，这将设置所有 href 属性仅匹配第一个。 - Rory McCrossan

抱歉打扰您，您的意思是这个只适用于第一个<a>标签吗？ - wowo

它将更新所有的href值，但会将它们全部设置为相同的值 - 第一个href的值。 - Rory McCrossan

谢谢，我认为这就是作者想要的。谢谢。 - wowo