.png)
Which property can be used to modify the content of HTML element ?
In this article, we will see the property that can be used for modify the content of HTML element. To modify the content of HTML element, we will use HTML DOM innerHTML Property.
The innerHTML property is used to set or return the content of HTML element.
Syntax:
It returns the content of an element.
Object.innerHTML
It is used to set the content of an element.
Object.innerHTML = value
Approach: In the below example, we will create a div element containing an id “content” and an input button element. When user click on button, the JavaScript function called. Inside the JavaScript function, first select the div element using document.getElementById() selector and use innerHTML property to modify the content of div element.
Example:
HTML
<!DOCTYPE html><html lang="en"> <head> <title> Which property can be used to modify the content of the HTML element? </title> <style> h1 { color: green; } #content { font-size: 20px; } </style></head> <body> <center> <h1>GeeksforGeeks</h1> <h3> Which property can be used to modify <br>the content of HTML element? </h3> <div id="content"> Welcome to GeeksforGeeks </div> <br> <input type="button" value="Change Content" onclick="myGeeks()"> </center> <script> function myGeeks() { document.getElementById("content").innerHTML = "A computer science portal for geeks"; } </script></body> </html> |
Output:
.png)
