html+js来获取服务器时间

      只用一个html+js来获取服务器时间并在html显示出来(只要显示时间数字 每秒变化),只能写一个html文件 jsp和后台java不能修改或增加。后台只需tomcat启动。因为我们只要取得服务器的时间,所以HEAD方法很合适。

      使用Ajax每秒获取服务器的时间,然后在显示出来,但是这个用户的网络延迟比较厉害,请求的时间两三秒才到达客户端,那这样更新的时间就不准确了。

       采用这样处理效果好得多,第一次页面加载时从服务器端获得时间,然后以这个时间为基准,客户端再用js每秒累加。一下代码是完整的处理:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>server time</title>

<script type="text/javascript">

function gainTime() {
 if(window.ActiveXObject) {
  xmlHttpRequest=new ActiveXObject("microsoft.XMLHTTP");
 } else if (window.XMLHttpRequest) {
  xmlHttpRequest=new XMLHttpRequest(); 
 }
 
 xmlHttpRequest.open("HEAD","http://localhost:8088/webdemo/1.html",true);
 xmlHttpRequest.send("");
 xmlHttpRequest.onreadystatechange=function() {
  if(xmlHttpRequest.readyState==4) {
   if (xmlHttpRequest.status == 200) {
       var dateStr=xmlHttpRequest.getResponseHeader("Date");
    var d=new Date(dateStr);
    var h = d.getHours();
    var m = d.getMinutes();
    var s = d.getSeconds();
    m = checkTime(m);
    s = checkTime(s);
    var timeStr = h + ":" + m + ":" + s;
   
    setInterval(function(){
     var arr = timeStr.split(":");
     if (arr[2] < 59) {
      arr[2] ++;
      arr[2]=checkTime(arr[2]);
     } else if (arr[2] == 59 && arr[1] < 59) {
      arr[1] ++;
      arr[1]=checkTime(arr[1]);
      arr[2] = "00";
     }
     
     if (arr[1] == 59 && arr[2] == 59 && arr[0] < 23) {
      arr[0] ++;
      arr[1] = "00";
      arr[2] = "00";
     }
     
     if (arr[1] == 59 && arr[2] == 59 && arr[0] == 23) {
      arr[0] = "00";
      arr[1] = "00";
      arr[1] = "00";
     }
     
     timeStr = arr.join(":");
     document.getElementById("txt").innerHTML=timeStr;
    },1000);
    
     }
     }
 }
}

function checkTime(i) {
 if (i<10) {
  i="0" + i
 }
 return i
}


</script>


</head>
<!-- <body onload="setInterval('gainTime()',1000);"> -->

<body onload="gainTime();">
<p>welcome</p>

<div id="txt"></div>

</body>
</html>

你可能感兴趣的:(html+js来获取服务器时间)