LoginSignup
3

More than 5 years have passed since last update.

【HTML5】contenteditable属性

Last updated at Posted at 2016-07-10

contenteditableとは?

contenteditable属性は、HTMLのコンテンツをブラウザ上で編集することができるようになります。
IE5.5で追加された機能です。
HTML5でもサポートされることになり、Chrome 11, Firefox 3.0, Opera 10.6, Safari 3.2でもサポートされました。

値は?

説明
inherit 親の要素の属性を継承します。既定値
true 編集モードをオフにします
false 編集モードをオフにします

使用例

HTMLの場合

index.html
<div contenteditable=true>
    この文章はブラウザで編集できます
</div>

JSの場合

test.js
document.getElementById('id').contentEditable = true;

参考サイト一覧

HTMLリファレンス
ブラウザをテキストエディタっぽく使うサンプルを作ってみたら意外に単純にできますた
contentEditableをJavaScriptで変更する際に気をつける事
[HTML5API] contentEditable 属性を使用したリッチテキストエディタの実現
Internet Explorer 5.5 を使った 編集可能な Web ページの作成方法

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3