网页版简易计算器

步骤:
1、对简单计算器的页面进行布局
         在没有牵扯大量图片的前提下:
             1)table布局
             2)div+Css布局
                   外层div
                  文本输入框:div嵌套
            
            这里我们选用table布局
            5行4列的表格+表格标签的一些属性+文本输入框的样式
2、
      2.1需要点击数字键以及运算符,进行计算
      2.2将数字键以及小数点看成一类,指定同名的class属性
      2.3 将运算符看成一类,指定同名的class属性
      2.4 将清除键,退格键,等号,表格上面的显示框分别设置id

3、使用js:dom操作 获取清除键/退格键/等号/显示框所在的标签对象

4、获取数字键所在的标签对象,分别设置点击事件

5、获取运算符所在的标签对象,分别设置点击事件
   设置获取到运算符的点击事件
              
                

    
    
    







    

        
C
        
退格
        
%
        
/
    
    

        
7
        
8
        
9
        
*
    
    

        
4
        
5
        
6
        
-
    
    

        
1
        
2
        
3
        
+
    
    

        
0
        
.
        
=
    

效果截图： 

问题:用户在输入第一个数和第二个数之和进行计算,可能继续点击运算符或者直接输出结果=
如判断用户点击的是=还是运算符呢?
 
解决：通过numvalue2的值是否为空来进行判断 :应该在设置运算符的点击事件中进处理

在： operators[i].onclick = function(){
        //如何判断点击的是=还是继续点击运算符
        //通过numValue2的值是否为空判断
        if(numValue2==""){
            //用户输入了一个数据
            numValue2 = numValue1 ;
            //清空掉numValue1,等待下次接受数据
            numValue1 ="" ;
            //保存操作符
            oper = this.innerText ;
        }else{//用户要么点击=号,要么继续点击运算符进行运算处理

            //如果第一个值不为空,在继续进行运算
            if(numValue1!=""){
                //bug:每次用numValue1接受下一个数据,所以是空值的话,进行连乘的存在问题!

                resultFun() ;
            }
            //保存操作符:
            oper = this.innerText ;
        }
    }

//1)bug:1.2 * 3 = 3.5999999996
// 使用Number对象的toFixed(num):保留num个有效位数

//2)bug:去掉输入数据的首尾无效0
//用字符串值乘以 number类型

//3)bug:小数点问题:只能出现一个,并且输入第一个数的第一位数的时候不能点击小数点
// （1）如果第一个点击的数据是"."(小数点)，则前面拼接一个零；
// （2）直接第一次无法点击小数点（不显示）