能给一份单独第三次修改的完整代码吗
第一二次修改注释了太多代码了 视频里上下滑来滑去的 完全看不懂
想要单独完整的第三次修改的代码 慢慢分析理解
7
收起
正在回答
2回答
源码中有标注着第几次修改的,并没有互相穿插。老师下面给你粘贴出第三次的代码了:
// 第三次改进--提取函数
// 获取元素
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() {
switch (this.title) {
case 'add':
addHandler();
break;
case 'subtract':
subtractHandler();
break;
case 'multiply':
multiplyHandler();
break;
case 'divide':
divideHandler();
break;
}
};
});
// 遍历
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 subtract(num1, num2) {
return num1 - num2;
}
// 乘法
function multiply(num1, num2) {
return num1 * num2;
}
// 除法
function divide(num1, num2) {
return num1 / num2;
}
// 输出结果
function outputResult(result) {
resultOutput.innerHTML = result;
}
// 加
function addHandler() {
// sign.innerHTML = '+';
updateSign('+');
outputResult(add(formerInput.value, laterInput.value));
}
// 减
function subtractHandler() {
updateSign('-');
outputResult(subtract(formerInput.value, laterInput.value));
}
// 乘
function multiplyHandler() {
updateSign('×');
outputResult(multiply(formerInput.value, laterInput.value));
}
// 除
function divideHandler() {
updateSign('÷');
outputResult(divide(formerInput.value, laterInput.value));
}可以看一下哦。


恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星