JavaScript - 20

swstack < 1 min read

JavaScript - 20: Mini Project - Simple Counter

Create a working counter with three buttons: Increase, Decrease, and Reset. Update the displayed number when buttons are clicked.

✦ JavaScript Editor

▶ Live Output

`; outputFrame.srcdoc = html; } editor.session.on("change", updateOutput); updateOutput();

👀 Show Solution

let count = 0;
const countDisplay = document.getElementById("count");
const increaseBtn = document.getElementById("increase");
const decreaseBtn = document.getElementById("decrease");
const resetBtn = document.getElementById("reset");

increaseBtn.addEventListener("click", () => {
  count++;
  countDisplay.textContent = count;
});

decreaseBtn.addEventListener("click", () => {
  count--;
  countDisplay.textContent = count;
});

resetBtn.addEventListener("click", () => {
  count = 0;
  countDisplay.textContent = count;
});