Calculator: How to make it accept decimal numbers and percentage?

Question

below I will put my html and js codes so that it is possible to better understand my doubt. Right now, I'm trying to make it work with decimals like 3.5 + 3, and give the correct result: 6.5. At the moment it rounds down and gives 6. I've already prepared the code to accept the comma, with the code part below, but I still don't understand how to fix it:

if (button.classList.contains("number")) {
      if (buttonValue === ",") {
          if (currentValue.indexOf(",") === -1) {
              currentValue += buttonValue;
          }
      } else {
          currentValue += buttonValue; //concatena
      }
      currentOperation.textContent = currentValue; //actualiza el currentOperation para mostrar el valor actual
    }

Another thing is the percentage that is not working either...

            case "%":
                result = 100 * parseFloat(previousValue) / parseFloat(currentValue);
                break;

Below I leave the html and js codes. Thank you to all who are willing to help me find a solution!

 const buttons = document.querySelectorAll(".buttons-container button"); //obtiene todos los botones const currentOperation = document.querySelector(".current-operation"); //mostrar la operación actual y el resultado del cálculo. currentOperation.textContent = "0"; buttons.forEach(button => button.addEventListener("click", handleButtonClick)); //un detector de eventos de clic, llama a la handleButtonClick función a cada clic let currentValue = ""; //valor actual ingresado let previousValue = ""; //valor anterior ingresado let operation = ""; //operación actual function handleButtonClick(event) { const button = event.target; //event.target = propiedad para obtener el botón en el que se hizo clic const buttonValue = button.textContent; //textContent = propiedad para obtener el texto del botón //botones numéricos if (button.classList.contains("number")) { if (buttonValue === ",") { if (currentValue.indexOf(",") === -1) { currentValue += buttonValue; } } else { currentValue += buttonValue; //concatena } currentOperation.textContent = currentValue; //actualiza el currentOperation para mostrar el valor actual } //botones del operador if (buttonValue === "+" || buttonValue === "-" || buttonValue === "*" || buttonValue === "/" || buttonValue === "%") { operation = buttonValue; currentOperation.textContent = operation; previousValue = currentValue; //actualiza previousValue currentValue = ""; //borra la currentValue } //botón equal if (button.classList.contains("equal-btn")) { let result; //Realizar la operación switch (operation) { case "+": result = parseFloat(previousValue) + parseFloat(currentValue); break; case "-": result = parseFloat(previousValue) - parseFloat(currentValue); break; case "*": result = parseFloat(previousValue) * parseFloat(currentValue); break; case "/": result = parseFloat(previousValue) / parseFloat(currentValue); break; case "%": result = 100 * parseFloat(previousValue) / parseFloat(currentValue); break; } //Mostrar el resultado y borrar los valores currentOperation.textContent = result; previousValue = ""; currentValue = ""; } //botón AC if (button.classList.contains("AC-btn")) { previousValue = ""; currentValue = ""; currentOperation.textContent = "0"; } }

 <div class="calc"> <div class="operations"> <,--display--> <div class="name">Calculadora</div> <div class="current-operation"></div> </div> <div class="buttons-container"> <button class="AC-btn">AC</button> <button>%</button> <button>/</button> <button class="number">7</button> <button class="number">8</button> <button class="number">9</button> <button>*</button> <button class="number">4</button> <button class="number">5</button> <button class="number">6</button> <button>-</button> <button class="number">1</button> <button class="number">2</button> <button class="number">3</button> <button>+</button> <button class="number">0</button> <button class="number">,</button> <button class="equal-btn">=</button> </div> </div>

Answer 1

parseFloat doesn't work with the comma. Try replacing it with a dot instead:

parseFloat(value.replace(",", "."));