BETA

document.writeの代わりにdocument.getElementById('id').innerHTMLを使おう!

投稿日:2020-06-30
最終更新:2020-06-30

document.writeを使うとHTMLが消える!?

document.writeを使うときにすでにページができあがっている(ドキュメントの読み込みが完了している)と、新しく書き込みを始めてしまい他のHTMLが消えてしまいます。

これを防ぐためにもdocument.getElementById('id').innerHTMLを使いましょう!

document.getElementById('id').innerHTMLの使い方

test.html

<html>  
<head></head>  
<body>  
<script type="text/javascript" src="test.js">  
<div id="id"></div>  
</body>  

test.js

window.addEventListener('DOMContentLoaded', function() {  

    document.getElementById('id').innerHTML = "テスト";  

});  

これでHTMLが消えることなく表示できます!

もちろん"テスト"の部分に変数を入れることも可能です。

技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
駆け出しエンジニアからエキスパートまで全ての方々のアウトプットを歓迎しております!
or 外部アカウントで 登録 / ログイン する
クランチについてもっと詳しく

この記事が掲載されているブログ

じゃーにゃりすとの技術ブログ

よく一緒に読まれる記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう