innerText……要素のタグは活きる。新たに指定した文字はテキストとして扱われる。
innerHTML……要素のタグは活きる。新たに指定した文字はHTMLとして扱われる。
outerText……要素と新たに指定した文字が入れ替わる。
outerHTML……要素と新たに指定したHTMLが入れ替わる。
うまく説明できてないが、このサンプルではボタンクリックで次のような変化がある。
1つ目(innerText):元のタグの内側に純粋な文字列として入る
2つ目(innerHTML):元のタグの内側にHTMLとして入る
3つ目(outerText):元のタグが削除されたうえで、指定した記述が純粋な文字列として置き換わる
4つ目(outerHTML):元のタグが削除されたうえで、指定した記述がHTMLとして置き換わる