老师,帮我看看哪里出问题了

来源:4-6 第五次修改--开放与封闭原则

陈孝芳

2020-02-26 22:08:57

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>第五次修改--开放与封闭原则</title>

</head>

<style>

body{

background-color:#eee;

}

#calculator{

margin:20% 30%;

}

</style>

<body>

<div id="calculator">

<p>

<input class="formerInput" value="1"></input>

<span class="sign">+</span>

<input class="laterInput" value="1"></input>

<span>=</span>

<span class="resultOutput">2</span>

</p>

<p>

<input type="button" value="+" class="btn" title="add">

<input type="button" value="-" class="btn" title="subtract">

<input type="button" value="x" class="btn" title="multiply">

<input type="button" value="÷" class="btn" title="divide">

<input type="button" value="%" class="btn" title="mod">

<input type="button" value="^" class="btn" title="power">

</p>

</div>


    <script type="text/javascript">

     //第五次改进--开放与封闭原则

     //获取元素


var wrapElem=document.querySelector("#calculator");

var calculatorElem={

formerInput:wrapElem.querySelector(".formerInput"),

laterInput:wrapElem.querySelector(".laterInput"),

sign:wrapElem.querySelector(".sign"),

resultOutput:wrapElem.querySelector(".resultOutput"),

btns:wrapElem.querySelectorAll(".btn")

};


//绑定事件

each(calculatorElem.btns,function(index,elem){

          elem.onclick=function(){

           updateSign(this.value);

           outputResult(operate(this.title,calculatorElem.formerInput.value,calculatorElem.laterInput.value));

};

});


//遍历

function each(array,fn){

for(var i=0;i<array.length;i++){

fn(i,array[i]);

}

}

//更新符合

function updateSign(symbol){

calculatorElem.sign.innerHTML=symbol;

}

        

        //运算

        function  operate(name,num1,num2){

         if(!operation[name])throw new Error("不存在名为"+name+"运算方法!");

         return operation[name](num1,num2);

        }

        var operation={

//加法

add:function(num1,num2){

          return +num1 + +num2;

},

//减法

subtract:function(num1,num2){

          return num1-num2;

},

//乘法

multiply:function(num1,num2){

          return num1*num2;

},

//除法

divide:function(num1,num2){

          return num1/num2;

},


addOperation:function(name,fn){

if(!this[name]){

this[name]=fn;

}

return this;

}

};

operation.addOperation("mod",function(num1,num2){

return num1%num2;

}).addOperation("power",function(num1,num2){

return Math.power(base,power);

});


        //输出结果

        function outputResult(result){

         calculatorElem.resultOutput.innerHTML=result;

        }



    </script>

</body>

</html>


写回答

1回答

好帮手慕粉

2020-02-27

同学你好,是同学在调用函数时传参传错了,并且求幂的函数时pow():

http://img.mukewang.com/climg/5e57278109909a9307300192.jpg

如果我的回答 帮助了你,欢迎采纳,祝学习愉快~

0

0 学习 · 14456 问题

查看课程