How to make a div element editable in HTML?
The element on the webpage which can be modified by the user is called the editable element. The HTML provides the way to make the div element editable. In this tutorial, we will learn the way to make the div element editable.
HTML contenteditable attribute
contenteditable attribute is used to the element which can be edited by the user. It must take one of the following values.
trueor empty string indicating that the element can be editable.
falseindicating that the content must not be edited.
For editable elements, the browser modifies the widget and allows editing.
Example: Make a div element editable
Here is a simple example to show you how we can use
contenteditable attribute to edit div contents.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>HTML</title> </head> <body> <h2> The div element is editable </h2> <div contenteditable=""> click on text to edit. </div> </body> </html>
Here is the output of the above program.
Example: Make editable HTML elements
In this program, we have used both the attribute value of
contenteditable to show how it functions.
So now if you want to include any div element which can be edited by the user. You can easily do it by using
contenteditable attribute within the div. Here we have explained it with examples.