【原生JS小实例】加减乘除取余计算器

html结构

<input type="text" id="txt1">
    <select id="operator">
        <option value="+">+</option>
        <option value="-">-</option>
        <option value='*'>*</option>
        <option value="/">/</option>
        <option value="%">%</option>
    </select>
    <input type="text" id="txt2">
    <input type="button" onclick="sum()" value="=">
    <input type="text" id="txt">

JS

<script>
        function sum() {
            let num1 = document.querySelector('#txt1').value;
            let num2 = document.querySelector('#txt2').value;
            let num3 = document.querySelector('#txt');
            let f = document.querySelector('select').value;
            num1 = Number(num1);
            num2 = Number(num2);
            let num4;
            switch (f) {
                case '+': num4 = num1 + num2; break;
                case '-': num4 = num1 - num2; break;
                case '*': num4 = num1 * num2; break;
                case '/': num4 = num1 / num2; break;
                case '%': num4 = num1 % num2; break;
            }
            num3.value= num4;
        }
    </script>

效果图

在写这个小实例的时候，博主刚刚接触JS，处于认识基础阶段，所以对于计算器的功能只能说是模拟