Web ページを定期的に自動的に更新するにはどうすればよいですか?-CSSチュートリアル-php.cn

Web ページを定期的に自動的に更新するにはどうすればよいですか?

王林

リリース： 2024-02-21 15:27:18

転載

3217 人が閲覧しました

Web ページを定期的に自動的に更新するにはどうすればよいですか?

「http-equiv」属性を持つ「meta」タグを使用するか、setInterval() ブラウザ API を使用することで、Web ページを自動的に更新できます。 Web サイトを自動的に更新する特定の使用例があります。たとえば、天気予報 Web アプリケーションを作成する場合、特定の場所のほぼ正確な気象データをユーザーに表示するために、一定の間隔後に Web サイトを更新する必要がある場合があります。

自動更新 Web サイトを設定する方法を学ぶために、以下の 2 つの方法を見てみましょう。

方法 1

この方法では、「meta」タグの「http-equiv」属性を使用して、「content」属性アプリに渡された特定の間隔の後に Web を更新します。 HTML5 仕様では、デフォルトでメタタグが提供されます。

構文

<meta http-equiv="refresh" content="n">

ログイン後にコピー

ここでの「n」は正の整数で、ページを更新する秒数を示します。

例

この例では、「meta」タグの「http-equiv」属性を使用して、Web アプリケーションを 2 秒ごとに更新します。

<!DOCTYPE html>
<html lang="en">
<head>
   <title>How to Automatic Refresh a web page in fixed time?</title>
   <meta http-equiv="refresh" content="2">
</head>
<body>
   <h3>How to Automatic Refresh a web page in fixed time?</h3>
</body>
</html>

ログイン後にコピー

メソッド 2

このメソッドでは、ブラウザーによって提供される「setInterval()」API を使用します。これにより、一定期間後にコードを実行できます。これらは両方ともパラメータとしてブラウザ API に渡されます。

Syntax

setInterval(callback_fn, time_in_ms)

ログイン後にコピー

「setInterval()」には 2 つのパラメータがあり、1 つ目は遅延後にトリガーされるコールバック関数で、2 つ目はミリ秒単位で指定される遅延です。

例

この例では、「setInterval()」ブラウザ API を使用して、Web アプリケーションを 2 秒ごとに更新します。

<!DOCTYPE html>
<html lang="en">
<head>
   <title>How to Automatic Refresh a web page in fixed time?</title>
</head>
<body>
   <h3>How to Automatic Refresh a web page in fixed time?</h3>
   <script>
      window.onload = () => {
         console.clear()
         console.log(&#39;page loaded!&#39;);
         setInterval(() => {
            window.location = window.location.href;
         }, 2000)
      }
   </script>
</body>
</html>

ログイン後にコピー

結論

この記事では、HTML5 と JavaScript という 2 つの異なる方法を使用して、一定時間後に Web アプリケーションを自動的に更新する方法を学びました。最初の方法では、「meta」タグの「http-equiv」属性を使用し、2 番目の方法では、「setInterval」ブラウザ API を使用します。

以上がWeb ページを定期的に自動的に更新するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。