HTML DOM isContentEditable Property

Last Updated : 19 Aug, 2026

The DOM isContentEditable property is used to return a boolean where true means the content of an element is editable and false represents content is not editable. This property is read-only. 

Syntax

Object.isContentEditable

Return Value: This property returns a boolean value.

  • true: means that the content of an element is editable.
  • false: means that the content of an element is not editable.

Example: In this example, we will use the isContentEditable property

HTML 
<!--Driver Code Starts-->
<!DOCTYPE html>
<html>
<head>
    <title>
        DOM iscontentEditable Property
    </title>
</head>
<body style="text-align: center">
    <h1 style="color:green">
        GeeksforGeeks
    </h1>
    <h2>
        DOM iscontentEditable Property
    </h2>
    <span id="P" contenteditable="true">
        Span 1 is editable.
    </span>
    <span id="P1">
        Span 2 is non editable.
    </span>
    <br>
    <br>
<!--Driver Code Ends-->

    <button onclick="myFunction()">
        Click me!
    </button>
    <p id="d"></p>
    <p id="d1"></p>
    <script>
        function myFunction() {
            let x =
                document.getElementById("P").isContentEditable;
            let y =
                document.getElementById("P1").isContentEditable;
            document.getElementById("d").innerHTML =
                "Span 1 is editable: " + x;
            document.getElementById("d1").innerHTML =
                "Span 2 is editable: " + y;
        }
    </script>

<!--Driver Code Starts-->
</body>
  
</html>
<!--Driver Code Ends-->
  • element.isContentEditable returns true if the element (or one of its ancestors) makes the content editable, and false otherwise. It reflects the effective editability after inheritance is applied.
  • While element.contentEditable returns (or accepts) a string ("true", "false", or "plaintext-only"), isContentEditable simply answers “Is this element editable right now?” with a clean true/false.
Comment

Explore