22. 第一個 JS 程式練習

HTML部份

<div id="footer">

　　這裡是footer區域（目前時間：<span id="nowArea"></span>）

</div>

 

CSS部份

#footer {
　　/* 原設定部份不改變 */
　　font-size: 12px;
　　color: #FFF;
}

#nowArea { color:#FF0; }

 

JavaScript部份（第一階段）

寫在上述<div id="footer">...................</div>的後方

<script type="text/javascript">
　　var now = new Date();
　　alert(now);
　　document.getElementById("nowArea").innerHTML = now;
</script>

 

【參閱範例結果】

 

JavaScript部份（第二階段）

搬移程式寫在<head>...................</head>區段內：

<script type="text/javascript">
function runTime(){
　　var now = new Date();
　　alert(now);
　　document.getElementById("nowArea").innerHTML = now;
}
</script>

 

修改<body>標籤:

<body onload="javascript:runTime();">

 

 

【參閱範例結果】