How do I make a button that adds 1 to a display every time it is clicked?

Question

How do I make a button that adds one to a display every time it is clicked? (in HTML or Javascript please?)

I probably should clarify "display". I mean like a number that appears somewhere on the screen.

Is this possible?

Answer 1

You can start with something like the following:

 let count = 0; button.addEventListener("click", () => { result.textContent = count + 1; count++; });

 <div id="result">0</div> <button id="button">Add 1</button>

In order to make that work in the browser, create an HTML file, so like index.html and add the following content to it:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div id="result">0</div>
    <button id="button">Add 1</button>
    <script>
      let count = 0;
      button.addEventListener("click", () => {
        result.textContent = count + 1;
        count++;
      });
    </script>
  </body>
</html>

Then you can open that file with the browser and it should be a good place to get started.

How do I make a button that adds 1 to a display every time it is clicked?

Question

1 answers

solution1
1 ACCPTED 2020-04-21 23:46:05

How do I make a button that adds 1 to a display every time it is clicked?

Question

1 answers

solution1 1 ACCPTED 2020-04-21 23:46:05

solution1
1 ACCPTED 2020-04-21 23:46:05