Давайте реализуем калькулятор. Он будет работать как обычный классический калькулятор: у вас будет инпут, а под ним кнопочки с цифрами и знаками операций. По нажатию на цифры они должны появляться в инпуте. По нажатию на знак операции число из инпута должно исчезать. После этого при вводе следующего числа в инпут и нажатия на знак равно в инпуте должен появится результат операции.
Реализуйте описанный калькулятор.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>focusout</title>
</head>
<body>
<! -- Задача 7.2>
<p></p>
<input type="text">
<table>
</table>
<script>
'use struck';
let p = document.querySelector('p');
let input =document.querySelector('input');
let table = document.querySelector('table');
let arr=['1', '2', '3', '4', '5', '6', '7', '8', '9', '0','-', '+', '*','='];
createTable();
addEvents();
function createTable() {
let k =0;
for (let i = 0; i ; i++) {
let tr=document.createElement('tr');
table.appendChild(tr);
for (let j = 0; j <5 ; j++) {
if (arr[k]!=undefined){
let td=document.createElement('td');
td.innerHTML=arr[k];
tr.appendChild(td);
}
k++;
}
}
}
function addEvents() {
let td = document.querySelectorAll('td');
for (let elem of td){
elem.addEventListener('click',function () {
if (elem.innerHTML!='='){
input.value=elem.innerHTML;
p.innerHTML+=elem.innerHTML;
}else{
let otw=eval(p.innerHTML);
p.innerHTML+=' = '+otw;
}
})
}
}
</script>
</body>
</html>