Разница между объектом узла и объектом элемента?

я полностью запутался между объектом узла и объектом элемента.
document.getElementById() элемент возвращает объект, в то время как document.getElementsByClassName()
возвращает объект NodeList (коллекция элементов или узлов?)



Если div является объектом элемента, то как насчет объекта узла div?



что такое объект узла?



являются ли объект документа, объект элемента и текстовый объект также объектом узла?



согласно книге Дэвида Фланагана " объект документа, его объекты элементов и текстовые объекты все узловые объекты'.



Так как объект может наследовать свойства/методы объекта элемента, а также элемента узла?



Если да, то я предполагаю, что класс узла и класс элемента связаны в прототипном дереве наследования.



 <div id="test">

           <p class="para"> 123 </p>

           <p class="para"> abc </p>

 </div>

 <p id="id_para"> next </p>



document.documentElement.toString();    // [object HTMLHtmlElement]



var div = document.getElementById("test");

div.toString();                         // [object HTMLDivElement]                       



var p1 = document.getElementById("id_para");

p1.toString();                          // [object HTMLParagraphElement]



var p2 = document.getElementsByClassName("para");

p2.toString();                          //[object HTMLCollection]
668   5  

5 ответов:

A node - Это общее имя для любого типа объекта в иерархии DOM. А node может быть одним из встроенных элементов DOM, такие как document или document.body, это может быть HTML-тег, указанный в HTML, например <input> или <p> или это может быть текстовый узел, который создается системой для удержания блок текста внутри другого элемента. Итак, в двух словах, a node - Это любой объект DOM.

An element это один конкретный тип node как есть много других типов узлы (текстовые узлы, Узлы с комментариями, документ, узлов и т. д...).

DOM состоит из иерархии узлов, где каждый узел может иметь родителя, список дочерних узлов и nextSibling и previousSibling. Эта структура образует древовидную иерархию. Элемент document узел будет иметь свой список дочерних узлов (head узел и body узел). Элемент body узел будет иметь свой список дочерних узлов (элементы верхнего уровня на вашей HTML-странице) и так далее.

Итак, a nodeList - это просто массив, как список nodes.

элемент-это определенный тип узла, который может быть непосредственно указан в HTML с тегом HTML и может иметь такие свойства, как id или class. могут иметь детей, и т. д... Существуют и другие типы узлов, такие как узлы комментариев, текстовые узлы и т. д... с различными характеристиками. Каждый узел имеет свойство .nodeType который сообщает, какой тип узла это. Вы можете увидеть различные типы узлов (схемы от MDN):

enter image description here

вы можете увидеть ELEMENT_NODE является одним конкретным типом узла, где nodeType свойство имеет значение 1.

так document.getElementById("test") может возвращать только один узел, и это гарантированно будет элемент (определенный тип узла). Потому что он просто возвращает элемент, а не список.

С document.getElementsByClassName("para") может возвращать более одного объекта, то дизайнеры решили вернуть nodeList потому что это тип данных, который они создали для списка из нескольких узлов. Поскольку они могут быть только элементами (только элементы обычно имеют имя класса), это технически a nodeList в нем есть только узлы элемента типа, и дизайнеры могли бы сделать коллекцию с другим именем, которая была elementList, но они решили использовать только один тип коллекции, независимо от того, были ли в ней только элементы или нет.

EDIT: HTML5 определяет HTMLCollection, который представляет собой список HTML Элементы (не любой узел, только элементы). Ряд свойств или методов в HTML5 теперь возвращают HTMLCollection. Пока он очень похож по интерфейсу на A nodeList, различие теперь сделано в том, что он содержит только элементы, а не какой-либо тип узла.

различие между a nodeList и HTMLCollection мало влияет на то, как вы его используете (насколько я могу судить), но дизайнеры HTML5 теперь сделали это различие.

например,element.children собственность возвращает текущий уход.

339  
2016-01-13 20:47:18

Node предназначен для реализации древовидной структуры, поэтому его методы предназначены для firstChild,lastChild,childNodes и т. д. Это скорее класс для общей древовидной структуры.

а потом Node объекты Element объекты. Element наследует от Node. Element объекты фактически представляют объекты, указанные в HTML-файле тегами, такими как <div id="content"></div>. Элемент Element класс определяет свойства и методы, такие как attributes,id,innerHTML,clientWidth, blur() и focus().

некоторые Node объекты являются текстовыми узлами, а не Element объекты. Каждый и Document наследует от Node а также:

> Document.prototype.__proto__ === Node.prototype
  true

вот некоторые документы для узла и элемента classes:
https://developer.mozilla.org/en-US/docs/DOM/Node
https://developer.mozilla.org/en-US/docs/DOM/Element

38  
2013-04-16 05:21:38

лучший источник информации для всех ваших бед DOM

http://www.w3.org/TR/dom/#nodes

"в дереве участвуют объекты, реализующие интерфейс Document, DocumentFragment, DocumentType, Element, Text, ProcessingInstruction или Comment (просто называемые узлами)."

http://www.w3.org/TR/dom/#element

"узлы элементов просто известны как элементы."

5  
2012-04-02 18:34:59

узел:http://www.w3schools.com/js/js_htmldom_nodes.asp

объект Node представляет собой один узел в дереве документов. Узел может быть узлом элемента, узлом атрибута, текстовым узлом или любым другим типом узла, описанным в главе типы узлов.

элемент:http://www.w3schools.com/js/js_htmldom_elements.asp

объект элемента представляет элемент в XML-документе. Элементы могут содержать атрибуты, другие элементы или текст. Если элемент содержит текст, то текст представлен в текстовом узле.

дублирую :

5  
2017-05-23 15:34:45

узел используется для представления тегов в целом. Делятся на 3 типа:

атрибут Примечание: это узел, который внутри имеет атрибуты. Exp:<p id=”123”></p>

текстовый узел: это узел, который между Открытием и закрытием его имеют contian текстовое содержимое. Exp:<p>Hello</p>

узел элемента : это узел, который внутри имеет другие теги. Exp:<p><b></b></p>

каждый узел может быть одновременно, не обязательно только одного типа.

элемент просто узел элемента.

0  
2016-03-07 12:51:15

Comments

    Ничего не найдено.
Click here to cancel reply.