innerHTMLとtextContentの違い

結論

• innerHTML
  • HTMLの特殊文字（例：<,>のようにタグとして機能する文字）を機能させる
• textContent
  • 特殊文字をエスケープする（＝普通の文字として扱う）

例

See the Pen ZEbQOYa by shimizu517 (@shimizu517) on CodePen.

ポイント

• document.getElementById('hello'): html内のid="hello"を持つ要素を指定
• hello.textContent = "hello";
  • 要素内にテキストを入れる。

※HTMLにおいてテキストとはタグの中の文字列のこと