Web-JavaScript

运用html+css+JavaScript写一个简易的计算器；

 <div class="outbox">
        <input type="text"  id="input" disabled="disabled">
    </div>
    <div class="name">
    <div>
        <button onclick="addStr('+')">+</button>
        <button onclick="addStr('-')">-</button>
        <button onclick="addStr('*')">*</button>
        <button onclick="addStr('/')">/</button>
        <button onclick="clac('=')">=</button>
    </div>
    <div>
        <button onclick="addStr('1')">1</button>
        <button onclick="addStr('2')">2</button>
        <button onclick="addStr('3')">3</button>
        <button onclick="addStr('4')">4</button>
        <button onclick="addStr('.')">.</button>
    </div>
    <div>
        <button onclick="addStr('4')">4</button>
        <button onclick="addStr('5')">5</button>
        <button onclick="addStr('6')">6</button>
        <button onclick="addStr('7')">7</button>
        <button onclick="addStr('🐔')">🐔</button>
    </div>
    <div>
        <button onclick="addStr('8')">8</button>
        <button onclick="addStr('9')">9</button>
        <button onclick="addStr('0')">0</button>
        <button onclick="Clear('CE')">CE</button>
        <button onclick="back('C')">C</button>  
        
    </div>
</div>

<style>
        body{
            width: 450px;
            height: 500px;
            border: 1px solid black;
            margin: auto;
        }
        input{
            width: 430px;
            height: 60px;
            margin-top: 10px;
            margin-left: 5px;
        }
        button{
            width: 60px;
            height: 60px;
            margin-top: 20px;
            margin-left: 20px;
        }
        .name{
            width: 435px;
            height: 400px;
            border: 1px solid black;
            margin-top: 10px;
            margin-left: 5px;
        }
    </style>

 <script>
        // 获取字符串
        function addStr(S){ 
            var input=document.getElementById("input");
            input.value=input.value+S;
        }
        // 计算结果
        function clac(){
            var input=document.getElementById("input");
            var val=eval(input.value);
            input.value=val;
        }
        // 全部清除
        function Clear(){
            var input=document.getElementById("input");
            input.value="";
        }
        // 删除
        function back(){
            var input= document.getElementById("input");
            var str=input.value.substr(0,input.value.length-1);
            input.value=str;
        }
    </script>