# Иерархия встроенных классов в ООП в JavaScript

Встроенные классы также имеют иерархию. Давайте посмотрим на примере абзаца:

`<p>text</p>`

Получим ссылку на абзац в переменную:

`let elem = document.querySelector('p');`

Посмотрим на наш абзац в консоли:

`console.dir(elem);`

Как вы уже знаете, в свойстве `[[Prototype]]` содержится имя класса абзаца. Это `HTMLParagraphElement`. Если развернуть список свойств и методов этого класса, то снизу опять обнаружится свойство `[[Prototype]]`, которое будет содержать уже родительский класс и это будет `HTMLElement`. Для него также можно найти родителя и так далее.

Изучите иерархию классов для данного тега:

`<div>text</div>` `let elem = document.querySelector('div'); console.dir(elem);`

Изучите иерархию классов для данного тега:

`<input>` `let elem = document.querySelector('input'); console.dir(elem);`

Изучите иерархию классов для данной коллекции:

`<div>text</div> <div>text</div> <div>text</div>` `let elems = document.querySelectorAll('div'); console.dir(elems);`

Изучите иерархию классов для данной коллекции:

`<div> <p>text</p> <p>text</p> <p>text</p> </div>` `let elem = document.querySelector('div'); let elems = elem.children; console.dir(elems);`
← →
↑