【HTML】要素をテキスト入力可能にする属性contenteditable【629日目】

divとかの文字を変えたい

既存のページとかで、たまに文字変えたいなと思うときがありませんか。

いつも、開発者ツールとかで書き換えたりしてますか。

<div contenteditable=true>

contenteditableという属性を持つと、その属性を持った要素は、クリックとかすると、文字入力が可能になります。

以下に、このようなタグを置いておいたので、クリックして試してみてください。

<div contenteditable=true>変更可能だよ</div>

<div contenteditable=false>これはだめだよ</div>

変更可能だよ

これはだめだよ

JavaScriptや、開発者ツールで、ためしにcontenteditableを付与してみましょう。

かなり乱暴ですが、タグにこの属性をもたせれば、
全部のコンテンツが文字入力可能になりますね。

<body contenteditable=true>

こんなふうにページを書き換えてみてください。

楽しいことになりますよ。

・・・正直使いみちはあまり見えてないので、良い使い道知ってる方は教えてくださると助かります！