HTML DOM Element contentEditable 属性

定义和用法

contentEditable 属性设置或返回元素的内容是否可编辑。

提示：您也可以使用 isContentEditable 属性来查明元素内容是否可编辑。

另请参阅：

isContentEditable 属性

HTML contenteditable 属性

实例

例子 1

本段可编辑：

<p id="myP" contenteditable="true">I am editable.</p>

如果 "myP" 是可编辑的，则返回 true：

document.getElementById("myP").contentEditable;

亲自试一试

例子 2

将 "myP" 的内容设置为可编辑：

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

亲自试一试

例子 3

在内容可编辑之间切换：

cinst x = document.getElementById("myP");
if (x.contentEditable == "true") {
  x.contentEditable = "false";
  button.innerHTML = "Enable myP to be editable!";
} else {
  x.contentEditable = "true";
  button.innerHTML = "Disable myP be editable!";
}

亲自试一试

语法

返回 contentEditable 属性：

element.contentEditable

设置 contentEditable 属性：

element.contentEditable = value

属性值

值 描述
value
  • "true" - 内容可编辑
  • "false" - 内容不可编辑
  • "inherit" - 默认。如果父元素可编辑，则可编辑

返回值

类型 描述
字符串 如果元素可编辑，则为 true，否则为 false。

浏览器支持

element.contentEditable() 是 DOM Level 1 (1998) 特性。

所有浏览器都完全支持它：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
支持 9-11 支持 支持 支持 支持