ホームページ > ウェブフロントエンド > フロントエンドQ&A > jQueryを使って現在の時刻と曜日を取得する方法

jQueryを使って現在の時刻と曜日を取得する方法

PHPz
リリース: 2023-04-07 13:49:34
オリジナル
1416 人が閲覧しました

Web ページでは、現在時刻と曜日を取得する必要があることがよくあります。このとき、jQuery を使用して取得できます。特にリアルタイムで時刻を更新する必要がある場合は、比較的簡単です。 jQueryで実装します。

今回はjQueryを使って現在時刻と曜日を取得する方法を紹介しますので、皆様のお役に立てれば幸いです。

jQuery は現在時刻を実装します

次は、jQuery を使用して現在時刻を取得するコードです:

$(document).ready(function () {
    var date = new Date();
    var time = date.toLocaleTimeString();
    $('#time').text(time);
});
ログイン後にコピー

このコードの説明:

  1. #$(document).ready() は、ページ要素が操作できることを確認するために、ページがロードされた後にこの関数を実行することを意味します。
  2. var date = new Date();は、現在の時刻を取得し、取得した時刻を変数dateに代入するメソッドです。
  3. var time = date.toLocaleTimeString(); toLocaleTimeString() メソッドを使用して時間をローカライズし、変数 time に割り当てます。 。
  4. $('#time').text(time); 取得した時刻をページ上で指定した要素 #time に更新します。
完全なコードは次のとおりです。

nbsp;html>


    <meta>
    <title>jQuery获取当前时间</title>
    <script></script>


    <div></div>
    <script>
        $(document).ready(function () {
            var date = new Date();
            var time = date.toLocaleTimeString();
            $(&#39;#time&#39;).text(time);
        });
    </script>

ログイン後にコピー
結果は図に示すとおりです。

jQueryを使って現在の時刻と曜日を取得する方法

jQuery は曜日

次は、jQuery を使用して曜日を取得するためのコードです:

$(document).ready(function () {
    var date = new Date();
    var day = date.getDay();
    var weeks = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
    $('#week').text(weeks[day]);
});
ログイン後にコピー
このコードの説明:

  1. var day = date.getDay(); Yes 現在の曜日を取得し、取得した曜日を変数 day に代入するメソッド。
  2. var 今週 = ['日曜日', '月曜日', '火曜日', '水曜日', '木曜日', '金曜日', '土曜日']; 配列を定義し、格納します各週の名前。
  3. $('#week').text(weeks[day]); 取得した曜日をページで指定した要素#weekに更新します。
完全なコードは次のとおりです。

nbsp;html>


    <meta>
    <title>jQuery获取星期几</title>
    <script></script>


    <div></div>
    <script>
        $(document).ready(function () {
            var date = new Date();
            var day = date.getDay();
            var weeks = [&#39;星期日&#39;, &#39;星期一&#39;, &#39;星期二&#39;, &#39;星期三&#39;, &#39;星期四&#39;, &#39;星期五&#39;, &#39;星期六&#39;];
            $(&#39;#week&#39;).text(weeks[day]);
        });
    </script>

ログイン後にコピー
結果は図に示すとおりです。

jQueryを使って現在の時刻と曜日を取得する方法

jQuery は現在時刻と曜日の組み合わせ

次は、jQuery を使用して現在時刻と曜日を同時に取得するコードです:

$(document).ready(function () {
    setInterval(function () {
        var date = new Date();
        var time = date.toLocaleTimeString();
        var day = date.getDay();
        var weeks = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
        $('#time').text(time);
        $('#week').text(weeks[day]);
    }, 1000);
});
ログイン後にコピー
このコードの説明:

    Use
  1. setInterval() このメソッドは時刻と曜日を毎秒更新します。
  2. $('#time').text(time); 取得した時刻をページ上で指定した要素 #time に更新します。
  3. $('#week').text(weeks[day]); 取得した曜日をページで指定した要素#weekに更新します。
完全なコードは次のとおりです:

nbsp;html>


    <meta>
    <title>jQuery获取当前时间和星期几</title>
    <script></script>


    <div></div>
    <div></div>
    <script>
        $(document).ready(function () {
            setInterval(function () {
                var date = new Date();
                var time = date.toLocaleTimeString();
                var day = date.getDay();
                var weeks = [&#39;星期日&#39;, &#39;星期一&#39;, &#39;星期二&#39;, &#39;星期三&#39;, &#39;星期四&#39;, &#39;星期五&#39;, &#39;星期六&#39;];
                $(&#39;#time&#39;).text(time);
                $(&#39;#week&#39;).text(weeks[day]);
            }, 1000);
        });
    </script>

ログイン後にコピー
結果は図に示すとおりです:

jQueryを使って現在の時刻と曜日を取得する方法和星期几的组合

概要

合格 この記事を学習することで、jQuery を使用して現在の時刻と曜日を取得する方法をマスターできます。

実際の開発では、ニーズに応じて上記の方法を使用して、より良いユーザー エクスペリエンスを実現できます。

以上がjQueryを使って現在の時刻と曜日を取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート