Привет всем!)
Делаю калькулятор, создаю кнопки с помощью манипуляции с DOM.
Подскажите как можно сократить данный код пожалуйста!?
Может с помощью цикла? Как именно...?
const parentsOfAllElements = document.body;
const divCalculator = document.createElement('div');
divCalculator.className = 'calculator-grid';
parentsOfAllElements.appendChild(divCalculator);
const divOutput = document.createElement('div');
divOutput.className = 'output';
divCalculator.appendChild(divOutput);
const divPrevious = document.createElement('div');
divPrevious.setAttribute('data-previous-operand', '');
divPrevious.className = 'previous-operand';
divOutput.appendChild(divPrevious);
const divCurrent = document.createElement('div');
divCurrent.setAttribute('data-current-operand', '');
divCurrent.className = 'current-operand';
divOutput.appendChild(divCurrent);
const btnAllClear = document.createElement('button');
btnAllClear.setAttribute('data-all-clear', '');
btnAllClear.className = 'span-two';
btnAllClear.innerText = 'AC';
divCalculator.appendChild(btnAllClear);
const btnDelete = document.createElement('button');
btnDelete.setAttribute('data-delete', '');
btnDelete.innerText = 'DEL';
divCalculator.appendChild(btnDelete);
const btnOperationDivide = document.createElement('button');
btnOperationDivide.setAttribute('data-operation', '');
btnOperationDivide.innerText = '÷';
divCalculator.appendChild(btnOperationDivide);
const btnNumber1 = document.createElement('button');
btnNumber1.setAttribute('data-number', '');
btnNumber1.innerText = '1';
divCalculator.appendChild(btnNumber1);
const btnNumber2 = document.createElement('button');
btnNumber2.setAttribute('data-number', '');
btnNumber2.innerText = '2';
divCalculator.appendChild(btnNumber2);
const btnNumber3 = document.createElement('button');
btnNumber3.setAttribute('data-number', '');
btnNumber3.innerText = '3';
divCalculator.appendChild(btnNumber3);
const btnOperationMultiply = document.createElement('button');
btnOperationMultiply.setAttribute('data-operation', '');
btnOperationMultiply.innerText = '*';
divCalculator.appendChild(btnOperationMultiply);
const btnNumber4 = document.createElement('button');
btnNumber4.setAttribute('data-number', '');
btnNumber4.innerText = '4';
divCalculator.appendChild(btnNumber4);
const btnNumber5 = document.createElement('button');
btnNumber5.setAttribute('data-number', '');
btnNumber5.innerText = '5';
divCalculator.appendChild(btnNumber5);
const btnNumber6 = document.createElement('button');
btnNumber6.setAttribute('data-number', '');
btnNumber6.innerText = '6';
divCalculator.appendChild(btnNumber6);
const btnOperationAddition = document.createElement('button');
btnOperationAddition.setAttribute('data-operation', '');
btnOperationAddition.innerText = '+';
divCalculator.appendChild(btnOperationAddition);
const btnNumber7 = document.createElement('button');
btnNumber7.setAttribute('data-number', '');
btnNumber7.innerText = '7';
divCalculator.appendChild(btnNumber7);
const btnNumber8 = document.createElement('button');
btnNumber8.setAttribute('data-number', '');
btnNumber8.innerText = '8';
divCalculator.appendChild(btnNumber8);
const btnNumber9 = document.createElement('button');
btnNumber9.setAttribute('data-number', '');
btnNumber9.innerText = '9';
divCalculator.appendChild(btnNumber9);
const btnOperationSubtraction = document.createElement('button');
btnOperationSubtraction.setAttribute('data-operation', '');
btnOperationSubtraction.innerText = '-';
divCalculator.appendChild(btnOperationSubtraction) ;
const btnNumberPoint = document.createElement('button');
btnNumberPoint.setAttribute('data-number', '');
btnNumberPoint.innerText = '.';
divCalculator.appendChild(btnNumberPoint);
const btnNumberZero = document.createElement('button');
btnNumberZero.setAttribute('data-number', '');
btnNumberZero.innerText = '0';
divCalculator.appendChild(btnNumberZero);
const btnEquals = document.createElement('button');
btnEquals.setAttribute('data-equals', '');
btnEquals.className = 'span-two';
btnEquals.innerText = '=';
divCalculator.appendChild(btnEquals);