<!DOCTYPE html>
 <html lang="en">
 <head>
 <metacharset="utf-8">
 <title>无标题文档</title>
 <style>
 *{
 margin:0;
 padding:0
 }
 .cont{
 width:300px;
 height:500px;
 border:2px#000solid;
 padding:20px;
 margin:0auto
 }
 #jieguo{
 width:300px;
 height:40px;
 border:2px#000solid;
 margin-bottom:20px;
 font-size:24px
 }
 #btninput{
 width:75px;
 height:35px;
 margin:5px9px;
 border-radius:3px;
 border:1px#333solid
 }
 #btn{
 margin-bottom:20px
 }
 #qingchu,
 #deng{
 width:100px;
 height:35px;
 margin:5px7px;
 background:#B5EFEA;
 border:1px#173DB7solid;
 border-radius:3px
 }
 </style>
 <script>
 window.onload=function(){
 varjieguo=document.getElementById('jieguo')
 varinput=document.getElementById('btn').getElementsByTagName('input')//群组
 varqingchu=document.getElementById('qingchu')
 vardeng=document.getElementById('deng')
 for(vari=0;i<input.length;i++){
 input[i].onclick=function(){
 jieguo.value=jieguo.value+this.value
 }
 }
 deng.onclick=function(){
 jieguo.value=eval(jieguo.value)
 }
 qingchu.onclick=function(){
 jieguo.value=''
 }
 }
 </script>
 </head>
 <body>
 <divclass="cont">
 <divclass="top">
 <input type="text"id="jieguo">
 </div>
 <divid="btn">
 <input type="button"value="0">
 <input type="button"value="1">
 <input type="button"value="2">
 <input type="button"value="3">
 <input type="button"value="4">
 <input type="button"value="5">
 <input type="button"value="6">
 <input type="button"value="7">
 <input type="button"value="8">
 <input type="button"value="9">
 <input type="button"value="+">
 <input type="button"value="-">
 <input type="button"value="*">
 <input type="button"value="/">
 <input type="button"value="(">
 <input type="button"value=")">
 </div>
 <input type="button"id="qingchu"value="清除">
 <input type="button"id="deng"value="=">
 </div>
 </body>
 </html>

转载请注明原文地址https://xxhzm.cn/index.php/archives/9/

最后修改：2022 年 06 月 05 日
© 允许规范转载
如果觉得我的文章对你有用，请随意赞赏