JavaScript實現同步於本地時間的動態時間顯示方法_javascript技巧

本文執行個體講述了JavaScript實現同步於本地時間的動態時間顯示方法。分享給大家供大家參考。具體分析如下：

動態顯示時間的例子非常簡單，瞭解JavaScript之後就是幾行的代碼便能夠完成的事情，

但是對於一些未接觸過JavaScript的人來說，幾乎很大工程的樣子，然後在網上苦苦尋覓代碼，之後在茫茫的html代碼中尋求不到，最終得不到要領。
一、基本目標

實現一個隨同用戶端（瀏覽者機器上的）時間的網頁文本時間，使用最短的代碼。

二、製作過程

複製代碼 代碼如下:

<!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=gb2312" /> 
        <title>jsclock</title> 
    </head> 
    <body> 
        <script type="text/javascript"> 
        function clock() { 
            var time = new Date().toLocaleString(); 
            document.getElementById("clock").innerHTML = time; 
        } 
        setInterval("clock()", 1000); 
        </script> 
        <span id="clock"></span> 
    </body> 
</html>

1. Date對象如果使用沒有參數的建構函式，就會返回用戶端的時間，toLocaleString()方法就是把時間轉化成本地顯示時間的格式，如果僅僅是toString()方法則只把時間轉化成一個英語寫法的時間字串。同時，親自實現發現toLocaleTimeString()方法是不存在的，請不要折騰。如果對於系統內建的方法轉化出來的時間不滿意，請使用各類的getDay(),getMonth(),getFullYear()等方法去構造字串。再次不作展示。

2. innerHTML相當於id為clock其下的所有元素，document.getElementById("clock").innerHTML = time;一句的含義就把<span id="clock"></span>兩標籤中所夾的東西變為time字串的內容

3.本JavaScript的關鍵在於setInterval("clock()", 1000);函數，意思為每1000毫秒，也就是每1秒，把clock()函數執行一次。也就是每一秒把<span id="clock"></span>兩標籤中所夾的東西變為time字串的內容更新一次。

希望本文所述對大家的javascript程式設計有所協助。