2

It is said, in many many places, that they're both the same thing. But when they start explaining they refer to each one of them differently without giving a clear explanation about what's the difference?

Please try to be as specific as possible as I'm still learning JS not really great with it yet. :)

  • 2
    See http://stackoverflow.com/questions/9979172/difference-between-node-object-and-element-object –  Jul 17 '15 at 01:29
  • Thanks for the link, unfortunately I did see this post and it wasn't clear enough for me. I don't know if it's me being stupid or it's not clear for a beginner, but in any case do you have a simpler answer? @fubbe –  Jul 17 '15 at 01:30
  • To be very quick about it. All elements are nodes. But not all nodes are elements. For elements extend from nodes. And an object is an unsorted list of key value pairs, which can hold different data types, like primitves or references .... –  Jul 17 '15 at 01:35
  • Pretty similar question/answer here: [Difference between Node object and Element object?](http://stackoverflow.com/questions/9979172/difference-between-node-object-and-element-object/9979779#9979779). – jfriend00 Jul 17 '15 at 03:14

2 Answers2

3

A Node is an interface from which a number of DOM types inherit, and allows these various types to be treated (or tested) similarly. Ref: https://developer.mozilla.org/en-US/docs/Web/API/Node

The Element interface represents an object of a Document. This interface describes methods and properties common to all kinds of elements. Specific behaviors are described in interfaces which inherit from Element but add additional functionality. For example, the HTMLElement interface is the base interface for HTML elements, while the SVGElement interface is the basis for all SVG elements. Ref: https://developer.mozilla.org/en-US/docs/Web/API/Element

An object may represent anything. Objects have properties, which describe them, and methods which are actions that can be performed on them.

Putting it together:

You can create a DOM Node in a web page like so:

var node=document.createTextNode('A Node');

Then you can create a paragraph element:

var p=document.createElement('p');

Attach the node to the paragraph:

p.appendChild(node);

You may also reference the node and element as objects:

p.className='description';  // set the class property of the paragraph to 'description';

p.setAttribute('data-item', '8');  // add an attribute named data-item with a value of 8
user2182349
  • 9,569
  • 3
  • 29
  • 41
  • 1
    Nice explanation. For more additional clarification, **Node** and **Element** are Web(or HTML?)-domain concept, and **Object** are language(JaveScript)-domain concept. – Wonjung Kim Jul 17 '15 at 01:54
  • Yeah it was a nice explanation indeed, thanks @user2182349 ! –  Jul 17 '15 at 01:57
  • 1
    @WonjungKim : So only Objects are directly related to JS and the other two are actually HTML related? Didn't know that as well :) –  Jul 17 '15 at 01:58
  • @IslamElshobokshy : Right. In Node.js, there are no Node or element. – Wonjung Kim Jul 17 '15 at 02:05
0

all element is node but node not all element,element and node all are object type.

Jack loner
  • 11
  • 3