【HTML5】contenteditable属性

  • 0
    いいね
  • 0
    コメント
    この記事は最終更新日から1年以上が経過しています。

    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 ページの作成方法