Home >>Javascript Tutorial >getElementById() method
getElementById() method
document.getElementById() method in JavaScript
The document.getElementById() method in JavaScript returns the element of a specified id. In order to get the value of the input text document. getElementById method is used and the id of the input field needs to be defined.
Let's understand the document.getElementByID method in JavaScript by the following example:
<script type="text/javascript">
function getcube(){
var number=document.getElementById("number").value;
alert(number*number*number);
}
</script>
<form>
Enter No:<input type="text" id="number" name="number"/><br/>
<input type="button" value="get the cube" onclick="getcube()"/>
</form>
Output :
A dialogue box where the user will input the value and click on the button named 'get the cube' and a pop-up will appear with the cube of the entered value.
A dialogue box where the user will input the value and click on the button named 'get the cube' and a pop-up will appear with the cube of the entered value.
Let's take another Example :
<p>An unordered list:</p>
<ul>
<li>Book</li>
<li>Pen</li>
<li>Pencil</li>
</ul>
<p>Click the button to display the innerHTML of the third li element .</p>
<button onclick="myFunction()">Click me</button>
<p id="demo"></p>
<script>
function myFunction() {
var x = document.getElementsByTagName("LI");
document.getElementById("demo").innerHTML = x[2].innerHTML;
}
</script>
Output :
An unordered list:
- Book
- Pen
- Pencil
Click the button to display the innerHTML of the third li element .
Javascript Tutorial
Javascript Syntax
Javascript Comments
Javascript Variables
Javascript Data Types
JavaScript Operators
JavaScript If-else
JavaScript Switch
JavaScript Loop
JavaScript Function
JavaScript Objects
Javascript Array
Javascript Array Methods
JavaScript Boolean
JavaScript Math Object
JavaScript Number
Javascript String
JavaScript Date
Javascript Document Object Model(DOM)
getElementById() method
getElementsByName() method
getElementsByTagName() method
Javascript innerHTML
Javascript innerText
JavaScript Events
JavaScript Cookies
JavaScript Cookies Attributes
JavaScript cookie with multiple name
JavaScript delete cookies
JavaScript form validation
Registration form with javascript validation
submit form without submit button
How to create a countdown timer in jquery
Allow Only Numbers in Textbox Javascript
How to allow alphabets in text-box using JavaScript
JavaScript Classes
JavaScript Prototype Object
JavaScript Constructor Method
JavaScript static Method
JavaScript Encapsulation
JavaScript Inheritance
JavaScript Abstraction
JavaScript Polymorphism
No Sidebar ads