More "Try it Yourself" examples below.
Definition and Usage
The getElementById() method returns the element that has the ID attribute with the specified value.
This method is one of the most common methods in the HTML DOM, and is used almost every time you want to manipulate, or get info from, an element on your document.
Returns null if no elements with the specified ID exists.
An ID should be unique within a page. However, if more than one element with the specified ID exists, the getElementById() method returns the first element in the source code.
Browser Support
The numbers in the table specifies the first browser version that fully supports the method.
| Method | |||||
|---|---|---|---|---|---|
| getElementById() | Yes | Yes | Yes | Yes | Yes |
Syntax
document.getElementById(elementID)
Parameter Values
| Parameter | Type | Description |
|---|---|---|
| elementID | String | Required. The ID attribute's value of the element you want to get |
Technical Details
| DOM Version: | Core Level 2 Document Object |
|---|---|
| Return Value: | An Element Object, representing an element with the specified ID. Returns null if no elements with the specified ID exists |
More Examples
Example
Get the element with id="demo" and change its color:
var x = document.getElementById("demo"); // Get the element with
id="demo"
x.style.color = "red";
// Change the color of the element
Try it Yourself »
Related Pages
CSS Tutorial: CSS Selectors
CSS Reference: CSS #id Selector
HTML DOM Reference: HTML DOM id Property
HTML DOM Reference: HTML DOM Style Object