如果这看起来非常基本,请提前道歉。
我很困惑为什么会这样:
<div id="box">Hello World</div>
<button id="myButton">Click</button>
<script>
let myBox = document.getElementById('box');
let myButton = document.getElementById('myButton');
myFunction = () => {
myBox.innerHTML = 'Thanks';
}
myButton.addEventListener("click", myFunction);
</script>
但这并不:
<div class="box">Hello World</div>
<button class="myButton">Click</button>
<script>
let myBox = document.getElementsByClassName('box');
let myButton = document.getElementsByClassName('myButton');
myFunction = () => {
myBox.innerHTML = 'Thanks';
}
myButton.addEventListener("click", myFunction);
</script>
第二个通过类名而不是 Id 获取 DOM 元素会在控制台中生成以下错误:
Uncaught TypeError: myButton.addEventListener is not a function
已经四处搜寻,但似乎找不到任何明确的答案。
谢谢!
最佳答案
document.getElementsByClassName
返回具有提供的类名的多个元素,而 getElementById
返回具有提供的 id 的单个元素。
尝试:
let myButton = document.getElementsByClassName('myButton')[0]; // if there is single such button
关于javascript - ClassName 与 Id - Javascript 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45465615/