HTML contenteditable 属性

htmlweb developmentfront end technology更新于 2025/3/22 10:20:17

HTML 中的 contenteditable 属性用于设置内容是否可编辑，使用布尔值 true 或 false。此属性可用于任何元素，因为它是一个全局属性。

以下是语法 −

<element contenteditable =”true|false”>

如上所示，如果您希望元素可编辑，则设置为 true，否则设置为 false。

现在让我们看一个在 HTML 中实现 contenteditable 属性的示例 −

示例

<!DOCTYPE html>
<html>
<body>
   <h2 contenteditable="true">Demo Heading</h2>
   <p contenteditable="true">This is a demo line.</p>
</body>
</html>

这将产生以下输出。现在可以编辑标题和 p 元素了 −

现在，我们可以编辑标题和内容了。因此，让我们更改标题并显示屏幕截图 −

在上面的例子中，我们设置了一个标题和一些文本 −

<h2 contenteditable="true">演示标题</h2>
<p contenteditable="true">这是一个演示行。</p>

我们使用 contenteditable 属性将标题和内容设置为可编辑。将其设置为 true 后，您将能够在网页上进行编辑 −

h2 contenteditable="true"