我正在尝试用Javascript制作一个计算器。但不知何故，它并不起作用

我是一个JavaScript初学者。我正试图用它做一个计算器。它没有样式化，并且存在不需要的类属性。请忽略这一点。 这是我尝试使用的代码：

HTML5计算器
功能dis（val）{
document.getElementById（“displayArea”）.value=val；
}
函数计算（）{
var finalValue=document.getElementById（'diaplayArea'）.value；
var evaluatedValue=eval（最终价值）；
document.getElementById（'displayArea'）。值=y；
}
函数clear（）{
document.getElementById（'displayArea'）。值=“”；
}
1.
2.
3.
/


4.
5.
6.
*


7.
8.
9
+


.
0
=
-

查看此代码片段：

HTML5计算器
功能dis（val）{
如果（val！=''）
display.value+=val；
其他的
display.value=val；
}
函数计算（）{
display.value=eval（display.value）；
}
C
1.
2.
3.
/


4.
5.
6.
*


7.
8.
9
+


.
0
=
-
const display=document.getElementById（“displayArea”）；

因为您是Javascript初学者，所以让我向您展示事件委派方式和脚本放置

计算器
#按钮{
宽度：4em；
浮动：左；
边缘：2米；
}
#按钮：第n种类型（4n+1）{
清除：左侧；/*更换
*/
} 
#按钮：第n种类型（4n）{
左边距：1米；
}
C
1   2   3   / 
4   5   6   * 
7   8   9   + 
.   0   =   - 
//脚本部分位于任何htlm正文标记下
const buttons=document.getElementById（'buttons'））
，btClear=document.getElementById（'bt-clear'）
，displayArea=document.getElementById（'display-area'））
;
btClear.onclick=（）=>
{
displayArea.value=“”
}
buttons.onclick=e=>//事件委派。
{
如果（！e.target.matches（'button'））返回//忽略其他单击
让btVal=e.target.textContent.trim（）
开关（btVal）
{
案例“=”：
displayArea.value=eval（displayArea.value）
打破
案例“/”：
案例“*”：
格“+”：
案例'-'：
displayArea.value+=`${btVal}`
打破
违约：
displayArea.value+=btVal
打破
}
}

定义“它不工作”？var是否允许创建错误？这些错误是什么？拼写错误：

diaplayArea

在dis（/）周围加引号，所以是dis（“/”），这里有一大堆问题。学习如何使用浏览器开发工具将为您指出其中的许多方面。