Thiết kế website giá rẻ

Question

I followed through a tutorial in youtube. It is a simple calculator only. I checked and compared our code multiple times already but I still don’t know why mine doesn’t work. I am not getting any error message too. For example, when I click number 7, it doesnt show up.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Calculator | Corado </title>
</head>

<body>
    
<div class="wrapper">
<section class ="screen">0</section>

<section class="calc-buttons">
    <div class="calc-button-row">
    <button class="calc-button double">C</button>
    <button class="calc-button">← </button>
    <button class="calc-button">÷</button>
    </div>

    <div class="calc-button-row">
    <button class="calc-button">7</button>
    <button class="calc-button">8</button>
    <button class="calc-button">9</button>
    <button class="calc-button">×</button>
    </div>

    <div class="calc-button-row">
    <button class="calc-button">4</button>
    <button class="calc-button">5</button>
    <button class="calc-button">6</button>
    <button class="calc-button">−</button>
    </div>

    <div class="calc-button-row">
    <button class="calc-button">1</button>
    <button class="calc-button">2</button>
    <button class="calc-button">3</button>
    <button class="calc-button">&plus;</button>
    </div>

    <div class="calc-button-row">
    <button class="calc-button triple">0</button>
    <button class="calc-button">&equals;</button>
    </div>

</section>
</div>

<script src="script.js"></script>

</body>
</html>

let runningTotal = 0;
let buffer = "0";
let previousOperator;

document.addEventListener('DOMContentLoaded', init);

const screen = doucument.querySelector('.screen');



function buttonClick(value){
    console.log('Button clicked:', buttonText);
    if (isNaN(value)){
        handleSymbol(value);
    }
    else{
        handleNumber(value);
    }
    screen.innerText = buffer;

}

function handleSymbol(symbol)
{
    switch (symbol){
        case 'C':
        buffer= '0';
        runningTotal=0;
        break;

        case '=': 
            if (previousOperator === null)
                {
                    return
                }
                flushOperation (parseInt(buffer));
                previousOperator= null;
                buffer = runningTotal;
                runningTotal=0;
                break;
                
        case '←':
            if (buffer.length ===1){
                    buffer=0;
                }
                    else {
                        buffer = buffer.subString(0, buffer.length -1);
                    }
                    break;

        case '+':
        case '-':
        case 'x':
        case '÷ ':
                handleMath(symbol);
                break;
    }
}
                
        function handleMath(symbol){
            if (buffer ==='0')
            {
            return;
            }

            const intBuffer = parseInt(buffer);
            if (runningTotal === 0){
                runningTotal= intBuffer;
                }
            else{
                flushOperation(intBuffer);
                }
                previousOperator= symbol;
                buffer= '0';
                }

        function flushOperation(intBuffer){
            if (previousOperator === '+'){
                runningTotal += intBuffer;
                }
            else if (previousOperator === '-'){
                runningTotal -= intBuffer;
                }
            else if (previousOperator === 'x'){
                runningTotal *= intBuffer;
                }
            else if (previousOperator === '÷'){
                runningTotal /= intBuffer; }
                }
              
        function handleNumber (numberString){
            if (buffer === '0'){
                buffer = numberString;
                }
            else{
                buffer += numberString;
                }
                }
     
   function init(){
                    document.querySelector('.calc-buttons').addEventListener('click', function(event){
                        buttonClick(event.target.innerText);
                    })
                }
     
    init();

I double checked everything and its still not working. This is also my first time using javascript and vs code.

Thiết kế website giá rẻ

Danh mục

Why isn’t my buttons working in javascript?