Javascript 按钮不存在'；我不能按一下键工作。我关注了一段YouTube视频，但它没有'；我不工作

当我点击一个按钮时，该数字不会显示在

当前输出

div上。如果我正确连接了按钮，这应该是一个测试。有可能解决这个问题吗？这可能是使用类的问题吗？我正在用普通JavaScript编写代码

const numberButtons=Array.from（document.getElementsByClassName（'number'）；
const previousOutputText=Array.from（document.getElementsByClassName（'previous-output'））；
const currentOutputText=Array.from（document.getElementsByClassName（'current-output'））；
类计算器{
构造函数（previousOutputText、currentOutputText）{
this.previousOutputText=previousOutputText；
this.currentOutputText=currentOutputText；
}
addNumber（数字）{
此.currentOutput=编号；
}
updateDisplay（）{
this.currentOutputText.innerHTML=this.currentOutput；
}
}
const calculator=新计算器（previousOutputText、currentOutputText）；
numberButtons.forEach（按钮=>{
按钮。addEventListener（'单击'，（）=>{
calculator.addNumber（button.innerHTML）；
calculator.updateDisplay（）；
})
})

自动控制
德尔
/
7.
8.
9
*
4.
5.
6.
-
1.
2.
3.
+
0
.
=

对于输出文本，GetElementsByCassName返回一个HTMLCollection，修复方法是获取输出元素的第一个索引

const numberButtons=Array.from（document.getElementsByClassName（'number'）；
const previousOutputText=document.getElementsByClassName（'previous-output'）[0]；
const currentOutputText=document.getElementsByClassName（'current-output'）[0]；
类计算器{
构造函数（previousOutputText、currentOutputText）{
this.previousOutputText=previousOutputText；
this.currentOutputText=currentOutputText；
}
addNumber（数字）{
此.currentOutput=编号；
}
updateDisplay（）{
this.currentOutputText.innerHTML=this.currentOutput；
}
}
const calculator=新计算器（previousOutputText、currentOutputText）；
numberButtons.forEach（按钮=>{
按钮。addEventListener（'单击'，（）=>{
calculator.addNumber（button.innerHTML）；
calculator.updateDisplay（）；
})
})

自动控制
德尔
/
7.
8.
9
*
4.
5.
6.
-
1.
2.
3.
+
0
.
=

您没有提供脚本位置，这可能是问题所在

用这行代码检查按钮是否确实是从DOM中找到的

console.log('Working on buttons', numberButtons);
numberButtons.forEach(button => {

如果它们不存在，请将

移动到

---

然后只需将一些

控制台。log

放入“点击平衡”处理程序，一些计算器方法将为您提供一个非常简单的调试。

输出的两个数组是错误的

你应该授权

我也不完全满意您代码中的“this”

const previousOutputText=document.querySelector（'.previousoutput'）；
const currentOutputText=document.querySelector（'.current output'）；
类计算器{
构造函数（previousOutputText、currentOutputText）{
此.currentOutput=“”；
this.previousOutputText=previousOutputText；
this.currentOutputText=currentOutputText；
}
地址号码（号码）{
此.currentOutput=编号；
}
updateDisplay（）{
this.currentOutputText.innerHTML=this.currentOutput；
}
}
const calculator=新计算器（previousOutputText、currentOutputText）；
document.getElementById（“容器”）.addEventListener（“单击”），函数（e）{
e、 preventDefault（）；//或使所有按钮类型为=“button”
常数tgt=e.target；
if（tgt.classList.contains（“btn”））{
calculator.addNumber（tgt.innerHTML）；
calculator.updateDisplay（）；
}
})

xxx
yyy
自动控制
德尔
/
7.
8.
9
*
4.
5.
6.
-
1.
2.
3.
+
0
.
=

GetElementsByCassName返回html集合，而不是数组