当サイトが開設されてから、かれこれ二十日ほどになります。まだそれほど長い時間ではなく、何しろ始まったばかりです。そこで、オンラインタイマーを書いて、サイトの運営時間を記録することにしました。前置きはこのくらいにして、さっそく始めましょう。

まず、JavaScript で時間を定義し、それから HTML で出力する方法を思いつきました。主に面倒なのは時間の計算です。以下にコードを紹介します。

HTML コード

当サイトは安定して稼働中です：<span id="htmer_time"></span>

JavaScript コード

function secondToDate(second) {
    if (!second) {
        return 0;
    }
    var time = new Array(0, 0, 0, 0, 0);
    if (second >= 365 * 24 * 3600) {
        time[0] = parseInt(second / (365 * 24 * 3600));
        second %= 365 * 24 * 3600;
    }
    if (second >= 24 * 3600) {
        time[1] = parseInt(second / (24 * 3600));
        second %= 24 * 3600;
    }
    if (second >= 3600) {
        time[2] = parseInt(second / 3600);
        second %= 3600;
    }
    if (second >= 60) {
        time[3] = parseInt(second / 60);
        second %= 60;
    }
    if (second > 0) {
        time[4] = second;
    }
    return time;
}

function setTime() {
    var create_time = Math.round(new Date(Date.UTC(2017, 04, 18, 2, 0, 0)).getTime() / 1000);
    var timestamp = Math.round((new Date().getTime() + 8 * 60 * 60 * 1000) / 1000);
    currentTime = secondToDate((timestamp - create_time));
    currentTimeHtml = currentTime[0] + '年 ' + currentTime[1] + '天 ' + currentTime[2] + '时 ' + currentTime[3] + '分 ' + currentTime[4] + '秒 ';
    document.getElementById("htmer_time").innerHTML = currentTimeHtml;
}
setInterval(setTime, 1000);

使用方法

1. time.js ファイルを新規作成し、JavaScript コードをそのファイルに記述します。
2. その time.js ファイルをサイトのルートディレクトリ（またはアクセス可能なディレクトリ。自分で覚えておけば大丈夫です）に配置します。
3. サイトのヘッダー部分で、この JavaScript ファイルを読み込みます。
4. 運営時間を表示したい場所に HTML コードを記述します。