JavaScript function getElementById


How to get access to HTML element by using ID ?

First consider that ID is a unique identifier , we have to assign unique ID to the HTML element. Two HTML tags can't have the same ID. We can accessed and apply JavaScript operations on the HTML element.

Syntax of getElementById

Example: <script type="text/javascript"> document.getElementById("mydiv"); </script>

Create a div container with some content and change the text color of the div container

<script type="text/javascript"> var a = document.getElementById("mydiv"); a.style.color = "blue"; </script>

Output of Below Code :

I am content of a DIV. My id="mydiv". I want to blue.
<html> <head> <title> Java Script Functions </title> </head> <body> <div id="mydiv">I am content of a DIV. My id="mydiv". I want to blue.</div> <script type="text/javascript"> function Change_Color() { var a = document.getElementById("mydiv"); // Get the element with id="mydiv" a.style.color = "blue"; } </script> <button onclick="Change_Color()">Click me To Change Color</button> </body> </html>
Chapter Next »