Javascript DOM HTML Element contentEditable Property set

Introduction

Set the content of a <p> element to be editable: 

document.getElementById("myP").contentEditable = "true";

View in separate window 

<!DOCTYPE html>
<html>
<body>

<p id="myP">This is a paragraph. Click the button to make me editable.</p>

<button onclick="myFunction()">Test</button>

<p id="demo"></p>

<script>
function myFunction() {//from w  w w  .j a  va 2s  .  com
  document.getElementById("myP").contentEditable = true;
  document.getElementById("demo").innerHTML = "The p element above is now editable. Try to change its text.";
}
</script>

</body>
</html>

The contentEditable property sets or gets whether the content of an element is editable or not.

You can also use the isContentEditable property to find out if the content of an element is editable or not.

Property Values

Value Description
inheritDefault. The element's content is editable if its parent element is editable
true The content is editable
falseThe content is not editable

The contentEditable property returns a String returns true if the element is editable, otherwise it returns false.




PreviousNext

Related