本文实例为大家分享了JS实现简单计算器的具体代码,供大家参考,具体内容如下
直接上图
HTML部分
& lt; !DOCTYPE html>
& lt; html>
& lt; head>
& lt;元charset=皍tf - 8”比;
& lt; title>我的第一个计算器& lt;/title>
& lt;链接rel="样式表" href=" https://www.yisu.com/zixun/计算器。css“rel=巴獠縩ofollow”/比;
& lt;脚本src=" https://www.yisu.com/zixun/计算器. js”比;
& lt;/script>
& lt;/head>
& lt; body>
& lt; h2祝辞欢迎使用& lt;/h2>
& lt; !——& lt;音频src=" https://www.yisu.com/zixun/audio/1.mp3 " id=耙衾帧北?
& lt;/audio>——比;
& lt;人力资源/比;
& lt; p祝辞输入不要超过8位数哦& lt;/p>
& lt; div类="盒子"比;
& lt; div类="头"比;
& lt; div类="屏幕"祝辞& lt; b id=皊1”祝辞& lt;/b> & lt;/div>
& lt; div类="屏幕"祝辞& lt; b id=皊2”祝辞& lt;/b> & lt;/div>
& lt;/div>
& lt; div类=澳谌荨北?
& lt;输入类型="按钮" name=" id="开始" value=" https://www.yisu.com/zixun/开始”/比;
& lt;输入类型="按钮" name=" id=扒逦奔壑?" https://www.yisu.com/zixun/清零”/比;
& lt;输入类型="按钮" name=" id=皑尅奔壑?" https://www.yisu.com/zixun/删除“/比;
& lt;输入类型="按钮" name=" id=巴Ｖ埂眝alue=" https://www.yisu.com/zixun/关闭”/比;
& lt;输入类型="按钮" name=" id=" b1 " value=" https://www.yisu.com/zixun/1 "/比;
& lt;输入类型="按钮" name=" id=" b2 " value=" https://www.yisu.com/zixun/2 "/比;
& lt;输入类型="按钮" name=" id=" b3 " value=" https://www.yisu.com/zixun/3 "/比;
& lt;输入类型="按钮" name=" id=癰 +”价值=" https://www.yisu.com/zixun/+ "/比;
& lt;输入类型="按钮" name=" id=" b4 " value=" https://www.yisu.com/zixun/4 "/比;
& lt;输入类型="按钮" name=" id=" b5 " value=" https://www.yisu.com/zixun/5 "/比;
& lt;输入类型="按钮" name=" id=" b6 " value=" https://www.yisu.com/zixun/6 "/比;
& lt;输入类型="按钮" name=" id=癰 - value=" https://www.yisu.com/zixun/- "/比;
& lt;输入类型="按钮" name=" id=" b7 " value=" https://www.yisu.com/zixun/7 "/比;
& lt;输入类型="按钮" name=" id=" b8 " value=" https://www.yisu.com/zixun/8 "/比;
& lt;输入类型="按钮" name=" id=" b9 " value=" https://www.yisu.com/zixun/9 "/比;
& lt;输入类型="按钮" name=" id="软" value=" https://www.yisu.com/zixun/*”/比;
& lt;输入类型="按钮" name=" id=" b0 " value=" https://www.yisu.com/zixun/0 "/比;
& lt;输入类型="按钮" name=" id=癰。”价值=癶ttps://www.yisu.com/zixun/薄?比;
& lt;输入类型="按钮" name=" id=" b=" valuehttps://www.yisu.com/zixun/="="/比;
& lt;输入类型="按钮" name=" id=" b÷" value=" https://www.yisu.com/zixun/"÷/比;
& lt;跨度比;
制作人:xxx,,,,,,监督人:xxx
& lt;/span>
& lt;/div>
& lt;/div>
& lt;/body>
& lt;/html>
CSS部分
* {
保证金:0 px;
填充:0 px;
}/*身体{
背景:cornflowerblue;
} */.box {
宽度:260 px;
身高:330 px;
边界:5 px固体cornflowerblue;
保证金:60 px汽车;
border - radius: 10 px;
}
.header {
宽度:260 px;
身高:80 px;
背景:浅蓝色;
}
.screen {
宽度:260 px;
高度:40像素;
背景:浅蓝色;
字体大小:25 px;
text-align:中心;
}
.content {
宽度:260 px;
身高:250 px;
颜色:黄绿色;
背景:# FAEBD7;
text-align:中心;
}
输入{
text-align:中心;
宽度:60 px;
高度:40像素;
背景:粉色;
margin-top: 4 px;
字体大小:15 px;
}
b {
颜色:紫红色;
}
JS部分
窗口。onload=function () {
函数$ (id) {
返回. getelementbyid (id);
}
函数put1 (id) {
$ (id)。onclick=function () {
美元(s1)。innerHTML=$ (s1) .innerHTML + this.value;
如果($ (s1) .innerHTML==116) {
提示(“你爱我吗”);
美元(s1)。innerHTML="嘻嘻”
}
如果($ (s1) .innerHTML==1129) {
警报(“我爱你”);
}
如果($ (s1) .innerHTML==1314520) {
警报(“我爱你”);
}
}
}
var的结果;
$ (" b=")。onclick=function () {
结果=eval ($ (s1) .innerHTML);
美元(s2)。innerHTML="=" +结果;
}
$("开始")。onclick=function () {
美元(s1)。innerHTML="欢迎使用”;
美元(s2)。innerHTML="使用前清零”;
$("音乐").play ();
}
$(“明确”)。onclick=function () {
美元(s1)。innerHTML=" ";
美元(s2)。innerHTML=" ";
}
美元(“停止”)。onclick=function () {
美元(s1)。innerHTML="再见”;
setTimeout(函数(){
美元(s1)。innerHTML=" ";
美元(s2)。innerHTML=" ";
},3000);
$("音乐").pause ();
}
$ (“▽”)。onclick=function () {
美元(s1)。.innerHTML innerHTML=$ (s1)。substr (0, $ (s1) .innerHTML。长度- 1);
}
put1 (b1);
put1 (b2);
put1 (b3);
put1 (b4);
put1 (b5);
put1 (b6);
put1 (“b7”);
put1 (“b8”);
put1 (b9);
put1 (“b0”);
put1 (“b +”);
put1 (“b -”);
put1(“软”);
put1 (" b÷");
put1 (“。”);
}
