Use js to display the current time example _ jquery-js tutorial

This article mainly introduces how to use js to display the current time example. jquery is also used here, so you have to introduce it to the front-end display of the page.

The Code is as follows:

Js script

The Code is as follows:

$ (Document). ready (function (){
// First
ShowTime ();
// Type 2
Var clock = new Clock ();
Clock. display ($ ("# clock "));
});

// Display the current time of the system. solution 1:
Function showTime (){
Var myArray = new Array (7 );
Var TD = new Date ();
MyArray [0] = "Sunday ";
MyArray [1] = "Monday ";
MyArray [2] = "Tuesday ";
MyArray [3] = "Wednesday ";
MyArray [4] = "Thursday ";
MyArray [5] = "Friday ";
MyArray [6] = "Saturday ";
Weekday = TD. getDay ();
Var h = TD. getHours ();
Var m = TD. getMinutes ();
Var s = TD. getSeconds ();
Var hstr = h;
Var mstr = m;
Var istr = s;
If (h <10) {hstr = "0" + h };
If (m <10) {mstr = "0" + m };
If (s <10) {istr = "0" + s };
$ ("# Clock "). innerHTML ('current time: '+ new Date (). toLocaleDateString () + "" + myArray [weekday] + "" + hstr + ":" + mstr + ":" + istr );
SetTimeout (showTime, 1000 );
}

// Display the current time of the system. method 2
Function Clock (){
Var date = new Date ();
This. year = date. getFullYear ();
This. month = date. getMonth () + 1;
This. date = date. getDate ();
This. day = newArray ("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday") [date. getDay ()];
This. hour = date. getHours () <10? "0" + date. getHours (): date. getHours ();
This. minute = date. getMinutes () <10? "0" + date. getMinutes (): date. getMinutes ();
This. second = date. getSeconds () <10? "0" + date. getSeconds (): date. getSeconds ();

This. toString = function (){
Return "the current time is:" + this. year + "year" + this. month + "month" + this. date + "day" + this. hour + ":" + this. minute + ":" + this. second + "" + this. day;
};

This. toSimpleDate = function (){
Returnthis. year + "-" + this. month + "-" + this. date;
};

This. toDetailDate = function (){
Returnthis. year + "-" + this. month + "-" + this. date + "" + this. hour + ":" + this. minute + ":" + this. second;
};

This. display = function (ele ){
Varclock = newClock ();
Ele. innerHTML = clock. toString ();
Window. setTimeout (function () {clock. display (ele) ;}, 1000 );
};
}