Confusing Terminology in JavaScript/DOM: tag, element, node, object, attribute, property, method

, , …,
Buy Xah JavaScript Tutorial.

Element

“Element” is the official name for a node of a HTML document. ⁖ <p>something</p> is a string representation of a HTML element. http://www.w3.org/TR/html51/syntax.html#elements-2

Tag

“Tag” is part of the syntax to represent a HTML node. ⁖ {<p>, </p>}. The <p> is “opening tag”, and </p> is “closing tag”. http://www.w3.org/TR/html51/syntax.html#elements-2

Node

“Node” is a node of DOM. A HTML element is a node. A XML element is a node. The xyz in <p>xyz</p> is a child node of the element “p”. Whitespace between elements is also a node. 〔➤ JavaScript: Navigate DOM Treehttp://www.w3.org/TR/html51/syntax.html#creating-and-inserting-nodes

Object

“Object” can mean many things in DOM.

Property

In CSS, {color, width, border, font-family, …} are properties. Full property table

In JavaScript, properties are the key/value pairs attached to object. ECMAScript 2015 §Overview#sec-property 〔➤ JavaScript: Property Overview

Attribute

“attribute” is basically a property of a node in HTML/XML. Mostly, it refers to things like {id, class, href, width, height, title, …} of a HTML element, or arbitrary such in XML. ⁖ in <x y="z">3</x>, the “y” is a attribute.

However, JavaScript the language also has “attribute”. That is, each “properties” has attributes {writable, enumerable, configurable}. 〔➤ JavaScript: Property Attributes: Writable, Enumerable, Configurable

Method

in JavaScript, a “method”, is a property whose value is a function. So, a method is also a property, technically.

In DOM, the term “property” seems to follow JavaScript, but, properties that are not functions are refered to as “property” proper. ⁖ { .length, .name, .nodeName, .parent .onclick, .baseURL, .characterSet, .color, …} are all properties, but “getElementById” is a “method”.

all these terms are not used consistently among docs (⁖ Mozilla vs Microsoft).

blog comments powered by Disqus