web:html:id

About

The DOM specification gives the concept of an element's unique identifier (ID)

An element's unique identifier can be used for a variety of purposes, most notably as a way to:

link to specific parts of a document using fragment identifiers,
target an element when scripting,
style a specific element from CSS.

Articles Related

Selection

The first purpose of an id is to be able to select the element.

getElementById Function

With the document getElementById function

Demo:

The HTML

<h1 id="id1">Heading content</h1>

The javascript

console.log("The content of the element with the id `id1` is "+document.getElementById("id1").innerHTML);

Result

Rendered by WebCode

Selector API

With the selector API (used by css), see the page: Selector API - ID (Unique Identifier) attribute

Shorthand notation

With Javascript, window lets you select the id directly.

<h1 id="id1">Heading</h1>

console.log("The content of the element with the id `id1` is "+window.id1.innerHTML);

Rendered by WebCode

Syntax

It is non-conforming to have two id attributes with the same value. This will be hard to debug. Duplicate IDs lead to the wrong element being selected, with sometimes disastrous effects whose cause is hard to determine.

HTML4

Tokens:

must be unique amongst all the IDs in the element's home subtree
must contain at least one character.
must not contain any space characters.
must begin with a letter ([A-Za-z])
may be followed by any number of letters, digits ([0-9]), hyphens (“-”), underscores (“_”), colons (“:”), and periods (“.”).

HTML5