あなたのテキストをHTMLによって編集可能にする小さい、単純なトリック

あなたが私の最近のつぶやきに続いていたならば、あなたは私が現在WES BosJavaScript30 challenge .
多くの課題がJavaScriptの知識のためのリフレッシュとして機能している間、私はチュートリアルを一時停止し、内部で叫んだ時があった
移動可能なテキストの影を作成するの課題に近づいたとき私は再びその瞬間を持っていた.
それがわかるように、HTMLグローバル属性がありますcontenteditable これは、ユーザーがブラウザ上のターゲットテキストを編集することができます.
によるとMDN documentation , contenteditable は、列挙された属性(Boolean値とは対照的に、可能な値のリストを持っている)ですtrue または空の文字列は、テキストが編集可能であることを示しますfalse を返します.
属性が値を与えられない場合、値は空の文字列として扱われます.

<div>
  <h1 contenteditable>🔥WOAH!</h1>
</div>

と同様に、あなたのブラウザで任意のテキストを入力できます.
CSSは、JavaScriptなし、入力フィールドの必要はありません.ちょっと小さなHTML属性.(セキュリティ関連情報については、チェックアウトしてくださいthis Stack Overflow discussion .)

あなたはcontenteditable 仕事で、または、あなたのプロジェクトのために?他のフロントエンドマジックは、あなたがすぐに発見したいですか?コメントであなたの経験を共有してください、私はいくつかの実用的なケースを見てみたい!🙌