HTML Element Attributes & Types

In the HTML DOM, an element object represents an HTML element. The Element interface signifies XML or HTML elements and exposes capabilities to access element tag names, child nodes, and attributes.
All HTML elements are represented by the HTMLElement type, including both direct instances and indirect ones. HTMLElement directly inherits from Element and adds several properties. Each property corresponds to one of the following standard attributes present on all HTML elements:

  1. id: A unique identifier for an element within a document;
  2. title: Contains additional information about an element, typically displayed in tooltip form;
  3. lang: The language code of the element's content;
  4. dir: The writing direction of the language;
  5. className: Equivalent to the class attribute and used to specify CSS classes for elements (since class is an ECMAScript keyword, this name cannot be used directly).

Related Example:

<div id="myDiv" class="bd" title="Body text" lang="en" dir="ltr"></div>
let div = document.getElementById("myDiv");
console.log(div.id);
console.log(div.className);
console.log(div.title);
console.log(div.lang);
console.log(div.dir);

HTML Elements and Their Types

Element Type
a HTMLAnchorElement
abbr HTMLElement
acronym HTMLElement
address HTMLElement
applet HTMLAppletElement
area HTMLAreaElement
b HTMLElement
base HTMLBaseElement
basefont HTMLBaseFontElement
bdo HTMLElement
big HTMLElement
blockquote HTMLQuoteElement
body HTMLBodyElement
br HTMLBRElement
button HTMLButtonElement
caption HTMLTableCaptionElement
center HTMLElement
cite HTMLElement
code HTMLElement
col HTMLTableColElement
colgroup HTMLTableColElement
dd HTMLElement
del HTMLModElement
dfn HTMLElement
dir HTMLDirectoryElement
div HTMLDivElement
dl HTMLOListElement
dt HTMLElement
em HTMLElement
fieldset HTMLFieldSetElement
font HTMLFontElement
frame HTMLFrameElement
frameset HTMLFrameSetElement
H1 HTMLHeadingElement
H2 HTMLHeadingElement
H3 HTMLHeadingElement
H4 HTMLHeadingElement
H5 HTMLHeadingElement
H6 HTMLHeadingElement
head HTMLHeadElement
hr HTMLHRElement
html HTMLHtmlElement
I HTMLElement
iframe HTMLIFrameElement
img HTMLImageElement
input HTMLInputElement
ins HTMLModElement
isindex HTMLIsIndexElement
kbd HTMLElement
label HTMLLabelElement
legend HTMLLegendElement
li HTMLLIElement
link HTMLLinkElement
map HTMLMapElement
menu HTMLMenuElement
meta HTMLMetaElement
noframes HTMLElement
noscript HTMLElement
object HTMLObjectElement
ol HTMLOListElement
optgroup HTMLOptGroupElement
option HTMLOptionElement
p HTMLParagraphElement
param HTMLParamElement
pre HTMLPreElement
q HTMLQuoteElement
s HTMLElement
samp HTMLElement
script HTMLScriptElement
select HTMLSelectElement
small HTMLElement
span HTMLElement
strike HTMLElement
strong HTMLElement
style HTMLStyleElement
sub HTMLElement
sup HTMLElement
table HTMLTableElement
tbody HTMLTableSectionElement
td HTMLTableCellElement
textarea HTMLTextAreaElement
tfoot HTMLTableSectionElement
th HTMLTableCellElement
thead HTMLTableSectionElement
title HTMLTitleElement
tr HTMLTableRowElement
tt HTMLElement
u HTMLElement
ul HTMLOListElement
var HTMLElement

Attributes

Every element has zero or more attributes, typically used to attach additional information about the element itself or its content. The DOM methods primarily associated with attributes are: getAttribute(), setAttribute(), and removeAttribute(). These methods are mainly used for manipulating attributes.