Skip to main content

JavaScript DOM — exercises and bug fixes

5 hands-on exercises and 5 find-the-bug challenges for the JavaScript DOM 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

    Read text from the page

    easy10 min

    Read the heading text and report it in #out.

  2. 2

    Change text on the page

    easy10 min

    Change the paragraph text to Updated, then report what it now says.

  3. 3

    Count child elements

    easy10 min

    Report how many child elements the box holds.

  4. 4

    Check an element exists

    easy10 min

    Report found when the element is there and missing when it is not.

  5. 5

    Read the body tag name

    medium10 min

    Report the tag name of the body element.

Find the bug(5)

  1. 1

    Fix the hash in getElementById

    easy8 min

    getElementById takes a bare id, without the hash.

  2. 2

    Fix the text read from the wrong element

    easy8 min

    The heading is being read instead of the note.

  3. 3

    Fix the change that never happened

    easy8 min

    The new text is worked out but never put on the element.

  4. 4

    Fix childNodes used for a count

    easy8 min

    childNodes includes text nodes, so the count is wrong.

  5. 5

    Fix the missing element guard

    easy8 min

    A missing element gives null, so it must be checked before use.

Ready to write the code?

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

Open the workspace