JavaScript入门——做一个简易的计算器！

第一步先写出计算器的样式
这里面使用了input文本框，select下拉框，button按钮；
样式如下：

代码如下：

<input type="text" id="t1">  //定义第一个输入文本框
    <select name="" id="sel1">  //+ - * /  下拉框  
        <option>+</option>
        <option>-</option>
        <option>*</option>
        <option>/</option>
    </select>
    <input type="text" id="t2"> // 定义第二个输入文本框
    <button id="btn1">=</button>  // 按钮
    <input type="text" id="t3">    //  定义第三个输出文本框  
  

样式写完以后就该写script部分
此过程分为两步：
第一步： 需要得到用户输入的需要计算的数据，这里面我们需要用到document.getElementById（）；例如： var txt1 = document.getElementById(“t1”);定义一个变量txt1，将我们找到的第一个输入文本框的内容“t1”赋值给txt1；
代码如下：

    <script>
        var txt1 = document.getElementById("t1");   // 得到第一个文本框的内容
        var txt2 = document.getElementById("t2");   // 得到第二个文本框的内容
        var txt3 = document.getElementById("t3");   // 
        var sel = document.getElementById("sel1");  // 得到下拉框内容
        var btn = document.getElementById("btn1");  // 得到=
        var num;  // 定义一个变量，将最后得到的值赋值给num

第二步： 当我们点击等于按钮的时候，需要计算用户第一第二个文本框输入的数字；这里需要注意的是input输入的内容是字符串，这里我们需要将字符串装换为数字，这里就得使用parseFloat()，例如：var text1 = parseFloat(txt1.value);
代码如下：

btn.onclick = function () {   // 这个意思是当我们点击btn的时候执行下面的代码
            var text1 = parseFloat(txt1.value);
            var text2 = parseFloat(txt2.value);
            switch (sel.value) {     // 这里需要使用switch语句
                case "+":
                    num = text1 + text2;
                    break;
                case "-":
                    num = text1 - text2;
                    break;
                case "*":
                    num = text1 * text2;
                    break;
                case "/":
                    num = text1 / text2;
                    break;
                default:
                    num = text1 + text2;
                    break;
            }
            txt3.value = num;  // 将最后的num值赋值给txt3，在第三个文本框中显示出来
        }
    </script>

下面是做好的效果图

到这里一个简单的计算器就做完了！