Js implements the simple display of time on the webpage, and js implements the webpage Method
This article describes how to simply display time on a webpage using js. Share it with you for your reference. The details are as follows:
This is a javascript code for webpage clock. It is implemented in pure javascript and is displayed in hours, minutes, and seconds. There are a lot of web page time display and web page clock. This is really simple. Good artists can further beautify and improve it on this basis.
Copy codeThe Code is as follows: <! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> simple web page clock </title>
<Style>
Body, div {margin: 0; padding: 0 ;}
Body {color: # fff; font: 16px/1.5 \ 5fae \ 8f6f \ 96c5 \ 9ed1 ;}
# Clock {width: 300px; text-align: center; background: # 1a1a1a; margin: 10px auto; padding: 20px 0 ;}
Span {color: #000; width: 80px; line-height: 2; background: # fbfbfb; border: 2px solid # b4b4b4; margin: 0 10px; padding: 0 10px ;}
</Style>
<Script>
Window. onload = function ()
{
Var oClock = document. getElementById ("clock ");
Var aSpan = oClock. getElementsByTagName ("span ");
SetInterval (getTimes, 1000 );
GetTimes ();
Function getTimes ()
{
Var oDate = new Date ();
Var aDate = [oDate. getHours (), oDate. getMinutes (), oDate. getSeconds ()];
For (var I in aDate) aSpan [I]. innerHTML = format (aDate [I])
}
Function format ()
{
Return a. toString (). replace (/^ (\ d) $/, "0 $1 ")
}
}
</Script>
</Head>
<Body>
<Div id = "clock">
<Span> </span> point <span> </span> minute <span> </span> second
</Div>
</Body>
</Html>
I hope this article will help you design javascript programs.