Skip to main content

JavaScript addEventListener — exercises and bug fixes

5 hands-on exercises and 5 find-the-bug challenges for the JavaScript addEventListener lesson. Every one is checked automatically in the browser — write the code, run it, and the tests tell you what still fails.

Sign in to start solvingCreate a free account

Exercises(5)

  1. 1

    Run a listener once

    easy10 min

    Use the once option so the count never goes past 1.

  2. 2

    Attach to every button

    easy10 min

    Loop over the buttons so any of them increases the count.

  3. 3

    Share one handler

    easy10 min

    Attach the same named function to both buttons.

  4. 4

    Add two listeners

    easy10 min

    Attach two listeners so the count reaches 2 on one click.

  5. 5

    Listen for a double click

    medium10 min

    Report Double when the button is double clicked.

Find the bug(5)

  1. 1

    Fix the missing once option

    easy8 min

    The listener should stop after the first click.

  2. 2

    Fix the listener attached to a list

    easy8 min

    A NodeList has no addEventListener; each element needs its own.

  3. 3

    Fix only the first button handled

    easy8 min

    querySelector attaches to one button, so the second does nothing.

  4. 4

    Fix the duplicate named handler

    easy8 min

    Adding the same named function twice only counts once.

  5. 5

    Fix once used where it should not be

    easy8 min

    The count should keep rising on every click.

Ready to write the code?

The editor, the automatic checks and the worked solutions open up with an account.

Open the workspace