JavaScript時間顯示三大心法

來源:互聯網
上載者:User
JAVASCRIPT的妙用
   前幾天,我的一位朋友問我:“你的個人首頁中有一個動態時間表,我很是喜歡。不知你是如何製作出來的?大概用了很複

雜的程式吧!”“你過獎了,其實這個顯示時間的程式非常簡單,只要你記住我以下的三大心法,我保證你的首頁也會絢麗多姿起來。”我自豪地笑道。
   心法一:在網頁中調用時間。
   心法口訣如下:<script language="javascript">
   function time_rota()
   {
   now = new Date();
   h="0"+now.getHours();
   m="0"+now.getMinutes();
   s="0"+now.getSeconds();
   if(hɵ){h=now.getHours()}
   if(mɵ){m=now.getMinutes()}
   if(sɵ){s=now.getSeconds()}
   document.write(" "+h+":"+m+":"+s+" ");
   }
   </script>
   <script>
   time_rota()
   </script>
   心法口訣重要部分說明:
  
   一.參數“0”。若不加此參數的話,時間表顯示的時間只是單位,例如,在淩晨1點零1分零1秒時顯示:“1:1:1”。是不是很難看啊!加了參數“0”後我們再看一下:“01:01:01”,變成了雙位顯示時間,漂亮了吧!
   二.“if”語句。這語句運用主要是為了正確顯示雙位時間,若不用此語句的話當“時,分,秒”無論哪一個超過10以後都會顯示三位元字,例如:在12點12分12秒時顯示:“012:012:012”,太誇張了!因此“if”語句一定要在程式中使用。
   另外,在網頁中調用時間程式也可以簡化為:(但是若您學過程式設計語言的話,您一定知道上面的程式要比下面的程式嚴謹得多,且下面的程式不能正確顯示雙位時間。)
   <script language="javascript">
   today=new Date();
   document.write(today.getHours()+":",today.getMinutes()+":",today.getSeconds());
   </script>
  
   心法二:網頁動態時間表。
   心法口訣如下:
   <script>
   function time_rota()
   {
   now = new Date();
   h="0"+now.getHours();
   m="0"+now.getMinutes();
   s="0"+now.getSeconds();
   if(hɵ){h=now.getHours()}
   if(mɵ){m=now.getMinutes()}
   if(sɵ){s=now.getSeconds()}
   document.Time.CLOCK.value =" "+h+":"+m+":"+s+" "
   setTimeout( 'time_rota()', 1000)
   }
   </script>
   <table>
   <tr>
   <td><form method="post" name="Time">
   <p><input name="CLOCK" size="12" value="顯示時間"> </p>
   </form>
   </td>
   <script>
   time_rota()
   </script>
   心法口訣重要部分說明:
   一.document.Time.CLOCK.value中的“Time、CLOCK”分別對應表單中“name,input name”後定義的名字。因此此兩部分內容必須相同,否則此程式肯定無效。
   二.setTimeout('time_rota()',1000)表示指定程式每秒運行一次,也就是動態計時。
   心法三:狀態條上的動態顯示時間。
   心法口訣如下:
   <script language="javascript">
   function time_rota()
   {
   now = new Date();
   h="0"+now.getHours();
   m="0"+now.getMinutes();
   s="0"+now.getSeconds();
   if(hɵ){h=now.getHours()}
   if(mɵ){m=now.getMinutes()}
   if(sɵ){s=now.getSeconds()}
   setTimeout( "time_rota()",1000);
   window.status=" "+h+":"+m+":"+s+" ";
   }
   </script>
   <script>
   time_rota()
   </script>
   心法口訣重要部分說明:
   此心法是從以上兩則心法中引伸而出,心法大意與上面相同。只是要學會使用window.status這一功能,它的作用是把文字顯示在狀態條上。
   “好了心法就講到這裡,我的朋友現在你的感覺如何,是不是躍躍欲試啦!”我望著他問道。“我記住了,謝謝!”他欣喜若狂……
   今天,我的那位朋友邀我去他的首頁上作客,他說會給我一份意外的驚喜。於是,我便上了他的首頁,原來他也用上的動態時間表並且在他的網頁中向我表示了崇高的敬意同時稱我是“高手”。
   “‘高手’下一步你該做什嗎?對了寫文章,把此三大心法與網民們共用。”我自言自語道。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

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.