在 JavaScript 上使用相同的类更改 <a> href [重复]

Posted 2023-03-05

【中文标题】在 JavaScript 上使用相同的类更改 <a> href [重复]

【英文标题】：JavaScript, change the href attribute of multiple a elements that have the same class [duplicate]

【发布时间】：2022-01-09 14:44:27

【问题描述】：

我想用 javascript 更改（或控制...）我的 <a> href

<a class="google" href="#">LINK ONE</a>
<a class="google" href="#">LINK TWO</a>

还有一个 JavaScript ：

document.querySelectorAll("a.google").href = "https://google.com"

如果我使用querySelector(".google") 它会更改链接，但只是主题之一。如果我使用querySelectorAll(".google") 或("a.google") 它不会改变任何东西......

谁能帮帮我？

【问题讨论】：

实际上document.querySelectorAl返回一个元素数组，你应该使用像for这样的迭代来访问每个元素然后更改href

阅读文档：querySelector、querySelectorAll。请尝试使用浏览器的debugging capabilities。使用browser console (dev tools)（点击F12）并查看document.querySelector("a.google") 和document.querySelectorAll("a.google") 是什么。 “Can someone help me?” is not an actual question.

【参考方案1】：

document.querySelectorAll 返回一个元素数组。为此，考虑一下这是个好主意，您可以这样做：

const links = document.querySelectorAll("a.google");
links.forEach(link => link.href = "https://google.com");

【讨论】：

谢谢，这解决了我的问题！我是 JavaScript 新手，除了创建一个通过按钮单击的函数并使 var 对其应用类/属性之外，我真的不知道该怎么做

我的荣幸。没关系，大家都是这样开始的。