【javascript】テキスト取得/テキスト表示させる方法（textContent、innerHTML、document.writeの違い）

javascriptで画面にテキストを表示させる方法を今回紹介していきたいと思います。

画面にテキストを表示させる方法

innerHTMLは文字列をhtmlとして解釈して画面に出力することができます。

htmlタグを出力した場合にはinnerHTMLを使います。

<div id="result"></div>

let result = document.getElementById('result');
result.innerHTML = '<p>textContentで画面にテキストを表示させます。</p>';

textContentはhtmlとして解釈されず文字列としてそのまま出力します。

なのでテキストのみを出力したい場合は textContentを使います。

let str = 'textContentで画面にテキストを表示させます。';
document.getElementById('result').textContent = str;

ページ画面に表示させる方法として「document.write」があります。

こちらは画面上のどこに表示させるかの指定ができないためあまり使うことが少ないと思います。

document.write(str);