Интерактивное путешествие по DOM

Здесь вы сможете побродить по DOM, посмотреть все элементы и проверить, все ли вы понимаете правильно.

Привет, отважные путешественники!

Вам предоставляется возможность побродить в чудесном мире DOM.

Путь начинается с document.documentElement (он же - тег <HTML>).

Ниже находится документ и кнопки управления. Сверяйте свои движения с картой (документом).

Все может оказаться совсем не так просто. Как правило, уже первые движения вызывают вопрос "где я нахожусь?". Чтобы на него ответить - посмотрите на "Текущий узел" и сверьте его с HTML.
Удачи и новых открытий!

HTML-разметка документа для путешествия

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>Документ</title>
    </head>
    <body>
        <div id="dataKeeper">Data</div>

        <ul>
            <li style="background-color:red">Осторожно</li>
            <li class="info">Информация</li>

        </ul>
        <div id="footer">Made in Russia &copy;</div>
    <!-- комментарий -->
    </body>
</html>

Так выглядит документ

Здесь стоите Вы

Текущий элемент

nodeType:

tagName:

nodeValue:

От текущего элемента могу двигаться:

Получить: