#プログラミング勉強日記
2020年11月2日
HTMLとJavaScriptのそれぞれのブラウザの自動リロードの方法をまとめる。

#HTMLのみを使った自動リロード
　metaタグではhttp-equiv="refresh"を定義することで指定秒後にページを自動リロードすることができる。このとき、`content="リロードさせるまでの秒数"を数字で指定する。

サンプルコード

<html>
  <head>
    <title>サンプルコード</title>
    <meta http-equiv="refresh" content="2;url=jikko1.html">
  </head>
  <body>
    <font>最初のページ。２秒後に移動する。</font>
  </body>
</html>

　この場合、ヘッダー情報としてheadタグの後に置く通常のmetaタグとは違って、例外的にHTMLファイルの冒頭に置くことになり、htmlタグやheadタグなどの構造は省略される。
　content="秒数；URL=移動先"で他ページを表示することもできる。(このときは構造タグは省略されない)

違うページにリロード

<html>
  <head>
    <meta http-equiv=”Refresh” content=”2;URL=https://qiita.com/mzmz__02”>
    <title>デザイナーズ プロジェクト [DSPT]</title>
  </head>
  <body>
    <font>最初のページ。２秒後に違うページに移動する。</font>
  </body>
</html>

#JavaScriptを使った自動リロード　
　setTimeout()とlocation.reload()を利用することで間隔でブラウザをリロードできる。

サンプルコード

setTimeout(function () {
    location.reload();
}, 2000);

#参考文献
３章リンク８．ページを自動的に移動させる
 ブラウザを自動的にリロードするいくつかの方法
 指定時間になったら自動でページをリロード（更新）・読み込む