JS to dynamically display the current time (12/24 hours)

Source: Internet
Author: User

Today, we need to dynamically display the current time and switch the 24/12-hour system. I remember I wrote a 24-hour system a long time ago, but I couldn't find it, so I wrote another one, copy and paste a copy if you need it.
A simple function is implemented in a few words. You can use the Date () object to get the current time, and then use setTimeout to get the latest time every one second.
I encountered a small problem during the write process: My initial idea was to use setInterval () to get the latest time every one second, but yes, but if setInterval is placed inside the main function, however, the memory leakage occurred (for the reason, I haven't figured it out yet). I used setTimeout () to solve the memory leakage problem at Rocky's reminder. Thanks to Rocky :)
Core code and demo

View sourceprint? 01 function nowTime (ev, type ){

02 /*

03 * ev: displays the time element.

04 * type: Time Display Mode. If 12 is input, it is in 12-hour format. If not input, it is in 24-hour format.

05 */

06 // year, month, day, hour, minute, second

07 var Y, M, D, W, H, I, S;

08 // when the unit is month, day, minute, and second, the first zero is added

09 function fillZero (v ){

10 if (v <10) {v = 0 + v ;}

11 return v;

12}

13 (function (){

14 var d = new Date ();

15 var Week = [Sunday, Monday, Tuesday, Wednesday, Friday, Saturday];

16 Y = d. getFullYear ();

17 M = fillZero (d. getMonth () + 1 );

18 D = fillZero (d. getDate ());

19 W = Week [d. getDay ()];

20 H = fillZero (d. getHours ());

21 I = fillZero (d. getMinutes ());

22 S = fillZero (d. getSeconds ());

23 // 12-hour Display Mode

24 if (type & type = 12 ){

25 // if you want to display more time types, such as early noon, you can add a judgment below

26 if (H <= 12 ){

27 H = morning + H;

28} else if (H> 12 & H <24 ){

29 H-= 12;

30 H = afternoon + fillZero (H );

31} else if (H = 24 ){

32 H = 00 PM;

33}

34}

35 ev. innerHTML = Y + year + M + month + D + day + + W ++ H ++: + I ++: + S;

36 // Update time per second

37 setTimeout (arguments. calli, 1000 );

38 })();

39}

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.