Previous | Table of Contents | Next

{ Recursion Exercises. }

Part 1: Recursion Exercises

Complete the exercises here and get the tests to pass!

Part 2: Reimplementing document methods using recursion

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <div class="row main sidepane">
        <h1>
            <p class="row foo"></p>
            <div class="row main sidepane">
                <h2>
                    <div class="row test">1</div>
                </h2>
            </div>
        </h1>
    </div>
    <div class="row">
        <div class="main">
            <h2 class="row">
                <div id="foo" class="row main sidepane">
                    2
                </div>
            </h2>
        </div>
    </div>
    <div class="row"></div>
</body>
</html>
  1. Given the following HTML, if you needed to select an element that has an ID of foo, you could use the document.getElementById method. Try to implement that function on your own! Here are some hints:
    • Use helper method recursion, it will be much easier!
    • In your outer function, store a variable that will either be the element found or null if the element can not be found.
    • In your inner function, iterate over an elements children and if you find the correct.
    • Invoke your inner function and pass in document.body.children so you start from the root of the DOM.
  2. Given the following HTML, if you needed to select all of the elements that are a div, you could use the document.getElementsByTagName method. Try to implement that function on your own! Here are some hints:
    • The code will be VERY similar to your previous method except you will be returning an array and not checking for the same id, but another property.
  3. Now given the following HTML, if you needed to select all of the elements that have a class of row, you could use the document.getElementsByClassName method. Try to implement that function on your own! Here are some hints:
    • The code will be VERY similar to your previous method except you will be checking to see if an element contains a class (research classList and you will find a convenient method).

When you're ready, move on to Dynamic Programming

Continue

Creative Commons License