Attribut contentEditable de l'élément HTML DOM

Définition et utilisation

contentEditable L'attribut définit ou retourne si l'élément est éditable.

Astuce :Vous pouvez également utiliser l'attribut isContentEditable pour vérifier si le contenu de l'élément est éditable.

Voir également :

Attribut isContentEditable

Propriété contenteditable HTML

Exemple

Exemple 1

Ce paragraphe est éditable :

<p id="myP" contenteditable="true">Je suis éditable.</p>

Si "myP" est éditable, retourne true :

document.getElementById("myP").contentEditable;

Essayez-le vous-même

Exemple 2

Rendre le contenu de "myP" éditable :

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

Essayez-le vous-même

Exemple 3

Basculer entre le contenu éditable et non éditable :

cinst x = document.getElementById("myP");
if (x.contentEditable == "true") {
  x.contentEditable = "false";
  button.innerHTML = "Activer myP pour qu'il soit éditable !";
}
  x.contentEditable = "true";
  button.innerHTML = "Désactiver myP pour qu'il soit éditable !";
}

Essayez-le vous-même

Syntaxe

Retourner l'attribut contentEditable :

element.contentEditable

Définir l'attribut contentEditable :

element.contentEditable = value

Valeur de l'attribut

Valeur Description
value
  • "true" - le contenu est éditable
  • "false" - le contenu n'est pas éditable
  • "inherit" - par défaut. Si l'élément parent est éditable, il est éditable.

Valeur de retour

Type Description
Chaîne true si l'élément est éditable, sinon false.

Support du navigateur

element.contentEditable() C'est une caractéristique de DOM Level 1 (1998).

Tous les navigateurs le supportent pleinement :

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Support 9-11 Support Support Support Support