Skip to main content

JavaScript Page Load Events — exercises and bug fixes

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

Exercises(5)

  1. 1

    Wait for the DOM

    easy10 min

    Report Ready from inside a DOMContentLoaded handler.

  2. 2

    Wait for everything

    easy10 min

    Report Loaded from inside a window load handler.

  3. 3

    Check the ready state

    easy10 min

    Report valid state when readyState is one of the three values it can hold.

  4. 4

    Find an element after loading

    easy10 min

    Read the heading from inside a DOMContentLoaded handler.

  5. 5

    Run in the right order

    medium10 min

    Report the order DOMContentLoaded and load fire in.

Find the bug(5)

  1. 1

    Fix the value read before the handler ran

    easy8 min

    The result is read outside the handler, before the event has fired.

  2. 2

    Fix load listened for on document

    easy8 min

    The load event is fired on window.

  3. 3

    Fix the misspelled event name

    easy8 min

    The name is DOMContentLoaded, with that exact spelling.

  4. 4

    Fix the readyState compared wrongly

    easy8 min

    There is no ready state; the values are loading, interactive and complete.

  5. 5

    Fix the order recorded wrongly

    easy8 min

    DOMContentLoaded fires before load, not after it.

Ready to write the code?

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

Open the workspace