【JavaScript】テキストを追加する2つの方法

こんにちは朱夏です。

今回は、JavaScriptでテキストを追加する方法を紹介したいと思います。

朱夏

JavaScriptでテキストを追加できれば、見る人によってテキストを変えたりすることができるはず。

以前のブラウザ情報の表示などの様に、見る人によって表示を変更したり、フォームで入力した内容を表示させたりすることが出来るようになります。

表示方法には、「document.write」を使う方法と、「innerHTML」を使う方法があります。

それではいってみましょう。

「document.write」を使う方法

初めに「document.write」を使う方法から紹介したいと思います。

実行サンプルはこちら。

See the Pen
dyYJojz by 朱夏 (@syunatsu1)
on CodePen.

HTMLのタグも使えるみたいですね。
しかし、こちらの方法ではIDに紐づけて表示位置を指定する事は難しい様です。

「innerHTML」を使う方法

次は「innerHTML」を使用する方法になります。

サンプルはこちら。

See the Pen
BaoJNXM by 朱夏 (@syunatsu1)
on CodePen.

「innerHTML」であれば、IDと紐づけて表示位置を指定して書き込むことが出来ます。

あとがき

というわけで、JavaScriptでテキストを表示する方法を紹介してみました。

「document.write」を使用しなくても「innerHTML」を使えば基本的には問題ないと思います。
「document.write」は一つの選択肢として覚えておくと良いと思います。

今回は以上です。
次回もよろしくお願いします。