"> tutorialpro.org(tutorialpro.org)" />
Easy Tutorial
❮ Att Colgroup Charoff Canvas Strokestyle ❯

HTML id Attribute

HTML Global Attributes

Example

Using the id attribute with JavaScript to manipulate a piece of text:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>tutorialpro.org(tutorialpro.org)</title> 
<script>
function displayResult()
{
    document.getElementById("myHeader").innerHTML="Have a nice day!";
}
</script>
</head>

<body>

<h1 id="myHeader">Hello World!</h1>
<button onclick="displayResult()">Edit Text</button>

</body>
</html>

Browser Support

All major browsers support the id attribute.


Definition and Usage

The id attribute specifies a unique id for an HTML element.

The value of the id must be unique within the HTML document.

The id attribute can be used as a link anchor, and to style or manipulate elements with the specified id using JavaScript (HTML DOM) or CSS.


Differences Between HTML 4.01 and HTML5

In HTML5, the id attribute can be used on any HTML element (it will validate any HTML element, though not necessarily be useful).

In HTML 4.01, the id attribute cannot be used with: <base>, <head>, <html>, <meta>, <param>, <script>, <style>, and <title>.

Note: HTML 4.01 had strict restrictions on the value of id (e.g., in HTML 4.01, the id value cannot start with a digit).


Syntax

Attribute Values

Value Description
id Specifies a unique id for the element. Naming rules: Must start with a letter A-Z or a-z<br>Subsequent characters: Letters (A-Za-z), digits (0-9), hyphens ("-"), underscores ("_"), colons (":"), and periods (".")<br>The value is case-sensitive

| | More Examples |

Using the id Attribute in CSS


❮ Att Colgroup Charoff Canvas Strokestyle ❯