4-4不知道那里错啦
//第三次次改进----函数提取
//获取元素
//querySelector获取指定元素第一个元素,
//querySelectorAll获取指定元素全部元素,
var calculator = document.querySelector('#calculator');
var formerInput = calculator.querySelector('.formerInput');
var laterInput = calculator.querySelector('.laterInput');
var sign = calculator.querySelector('.sign');
var resultOutput = calculator.querySelector('.resultOutput');
var btns = calculator.querySelectorAll('.btn');
//绑定事件
each(btns,function(index,elem){
elem.onclick = function(){
//console.log(this.value);
switch(this.title){
case'add':
addHandler();
break;
case'subtrautHandler':
subtrautHandler();
break;
case'multiplyHandler':
multiplyHandler();
break;
case'divideHandler':
divideHandler();
break;
}
};
});//不要忘记分号
//each函数接受参数(数组,函数),btns是数组,function是函数
//index是btns的索引,elem是btns的元素
//遍历
function each(array,fn){
for(var i = 0;i<array.length;i++){
fn(i,array[i]);
}
}
//更新符号
function updateSign(symbol){
sign.innerHTML = symbol;
}
//计算
//加法,减法,乘法,除法
function add(num1,num2){
return +num1+ +num2;
}
function subtraut(num1,num2){
return num1-num2;
}
function multiply(num1,num2){
return num1*num2;
}
function divide(num1,num2){
return num1/num2;
}
//输出结果
function outputResult(result){
resultOutput.innerTML =result;
}
//加
function addHandler(){
updateSign('+');
outputResult(add(formerInput.value,laterInput.value));
}
//减
function subtrautHandler(){
updateSign('-');
outputResult(subtraut(formerInput.value,laterInput.value));
}
//乘
function multiplyHandler(){
updateSign('×');
outputResult(multiply(formerInput.value,laterInput.value));
}
function divideHandler(){
updateSign('÷');
outputResult(divide(formerInput.value,laterInput.value));
}
正在回答 回答被采纳积分+1
- 参与学习 466 人
- 提交作业 74 份
- 解答问题 635 个
JavaScript不仅能实现静态页面到动态特效的转变,还能完成数据的动态交互,但是关于js到底功能有多强大,大家还是有所期待的,本路径将带你深入到js中,一一揭开JavaScript的神秘面纱。
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星