Set the contenteditable attribute to edit the content of HTML tags (can replace textarea)_HTML/Xhtml_Web page production

Copy code

The code is as follows:

If you add contenteditable="true" to BODY, you can see how magical this attribute is. Therefore, we can set the contenteditable="true" attribute to the HTML tag and the tag can be edited.

The contenteditable attribute is compatible with all browsers (the compatibility of versions prior to IE6 has not been tested)

In some cases, we can use DIV to replace input or textarea to achieve the same effect. For example, when using ajax, we can get the content of the DIV when submitting the form.

Careful people will find that the text box for posting comments in QQ space is actually a DIV, not a textarea text box.

How Div CSS simulates textarea text area height adaptability to meet the HTML5 standard contenteditable attribute

This effect is mainly achieved by adding the contenteditable attribute in HTML5 to the tag (contenteditable: specifies whether users are allowed to edit content). What’s great is that IE also supports this attribute, so you don’t have to worry too much about compatibility issues.
DEMO：

Copy code

The code is as follows: