我有两个不同的 html 文件，每个文件都有一个按钮 BTN 1 和 BTN 2，链接到同一个 js 文件，所以当我单击其中一个按钮时，我需要插入一个类来更改两个页面的背景颜色，怎么可能我用js选择了两个按钮来做到这一点。我试图选择这样的按钮：var ccc = document.getElementsByClassName("hola"); 控制台.log(ccc);但我明白了：HTMLCollection [button.hola] 长度：1 0：button.hola 原型：HTMLCollection只需一个按钮。如果我在单击时插入一个类，它只会更改该页面的正文，但无论我单击什么按钮，我都需要更改两者。我怎么能这样做谢谢你的帮助<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <button class="hello">BTN 1</button> <script src="js/script.js"></script></body> <!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <button class="hello">BTN 2</button> <script src="js/script.js"></script></body>
2 回答
凤凰求蛊
TA贡献1825条经验 获得超4个赞
您的代码中的问题可能与选择有关。当您使用时，getElementsByClassName您将获得一个元素数组，而不是单个元素。因此，如果您将使用document.getElementsByClassName("hola")[0]，您将获得您的元素。
我认为您应该使用id而不是className，因为当您使用时，document.getElementsByClassName("abc")您将获得同一类的元素数组。由于您在 2 个不同的页面中使用它，并且可能对其他元素也使用相同的类，因此数组的顺序可能不同，并且很难找到您的按钮。
用于document.getElementById("someID")获取特定元素，并对id两个按钮使用相同的元素（因为它们位于不同的页面上，这应该不是问题）。
let button = document.getElementById("myRedBodyButton");
button.addEventListener('click', function() {
document.body.classList.add("red");
});
.red {
background: red
}
<button id="myRedBodyButton">clickMe</button>
至尊宝的传说
TA贡献1789条经验 获得超10个赞
这是你要找的吗？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button id="hello">BTN 1</button>
<script>
var ccc = document.querySelector("button#hello")
ccc.addEventListener('click', function() {
document.body.style.backgroundColor = 'red';
})
</script>
</body>
</html>
添加回答
举报
0/150
提交
取消