Skip to main content

JavaScript DOM Traversal — exercises and bug fixes

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

    Find the parent

    easy10 min

    Report the id of the paragraph's parent.

  2. 2

    Read the first child

    easy10 min

    Report the text of the list's first child element.

  3. 3

    Read the next sibling

    easy10 min

    Report the text of the item after the middle one.

  4. 4

    Walk up with closest

    easy10 min

    From the span, find the nearest card and report its class.

  5. 5

    Handle a missing sibling

    medium10 min

    Report a message when the item has nothing after it.

Find the bug(5)

  1. 1

    Fix childNodes used for the first child

    easy8 min

    childNodes includes whitespace, so the first one is a text node.

  2. 2

    Fix nextSibling used for an element

    easy8 min

    nextSibling can land on whitespace between the tags.

  3. 3

    Fix the previous sibling used

    easy8 min

    The item after the middle one is wanted, not the one before it.

  4. 4

    Fix querySelector used to walk up

    easy8 min

    querySelector searches downwards; closest searches upwards.

  5. 5

    Fix parentNode used where the id is needed

    easy8 min

    The parent of the span is the paragraph, not the card.

Ready to write the code?

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

Open the workspace