js 倒计时 本地端获取时间 和获取服务器端时间

时间：2021-10-11 17:03:24

1.本地端JS 获取时间

JS代码 JQuery

<script type="text/javascript">
 function GetRTime(){
        var EndTime= new Date('2015/05/20 00:00:00');
       
        var NowTime =  new Date();

        var t =EndTime.getTime() - NowTime.getTime();
        var d=0,h=0,m=0,s=0;
        
        if(t>0){
            d=Math.floor(t/1000/60/60/24);
            h=Math.floor(t/1000/60/60%24);
            m=Math.floor(t/1000/60%60);
            s=Math.floor(t/1000%60);

            if(d<10){
                d="0"+d;
            }
            if(h<10){
                h="0"+h;

            }
            if(m<10){
                m="0"+m;
            }

        }
        else{
            d='00';
            h='00'
            m='00'

        }



        $("#t_d").html(d);
        $("#t_h").html(h);
        $("#t_m").html(m);


        /* document.getElementById("t_d").innerHTML = d ;
         document.getElementById("t_h").innerHTML = h ;
         document.getElementById("t_m").innerHTML = m ;
         document.getElementById("t_s").innerHTML = s ;*/
    }
    setInterval(GetRTime,0);

　　HTML

<div class="time" style="position: absolute; top: 100px; left: 990px;color: #fff;font-size: 24px;">
        <span id="t_d" style="letter-spacing: 6px; margin-left:2px;">00</span>
        <span id="t_h" style="margin-left: 20px;letter-spacing: 8px;">00</span>
        <span id="t_m" style="margin-left: 20px;letter-spacing: 8px;">00</span>
        </div>

　　

2. 获取服务器端的时间  根据接口

可以返回几种服务器时间格式
http://www.no5.com.cn/getservertime.asp
http://www.no5.com.cn/getservertime.asp?f=utc
http://www.no5.com.cn/getservertime.asp?f=date

这里就说下 就要考虑跨域的问题

同端口 同协议 同域名

 

没有跨域的情况

var servertime =$.ajax(
        {
            type:"get",
            url:"/getservertime.asp",

            success: function(data){

                return data; //返回的格式比如这样 2015-5-12 16:12:16  然后转化成日期格式2015/5/12 16:12:16
console.log( data.replace(/-/g,"/")); //替换- 为 /
console.log(new Date(data.replace(/-/g,"/")));
console.log(new Date(data.replace(/-/g,"/")).getTime());//获取毫秒数




            }

        }
    );

下面是完整例子

JS代码

<script type="text/javascript">
    var servertime ;//定义全局变量接收
        

    function GetRTime(){
//每一秒调用GetRTime 函数 同时ajax返回服务器时间
    $.ajax({
        type:"get",
        url:"/getservertime.asp",
        async:false,

        success:function(data){

            servertime = new Date(data.replace(/-/g,"/")).getTime();



        }
    })
var EndTime= new Date('2015/05/20 00:00:00'); //定义结束时间
var NowTime = servertime;// 接收服务器时间
 
var t =EndTime.getTime() - NowTime; //获取剩余时间差值毫秒数

var d=0, h=0, m=0, s=0; //定义天 时 分 秒 变量

if(t>0){ 

d=Math.floor(t/1000/60/60/24);

 h=Math.floor(t/1000/60/60%24); 

m=Math.floor(t/1000/60%60); 

s=Math.floor(t/1000%60); 

//个位数的时候前面加0

if(d<10){ 
d="0"+d; 
} 

if(h<10){
 h="0"+h;
 } 

if(m<10){ 
m="0"+m; 
} 

} 
else{ 
//结束后归0

d='00'; h='00' m='00' 

} 

$("#t_d").html(d); 
$("#t_h").html(h); 
$("#t_m").html(m); 

} 

setInterval(GetRTime,0); 

</script>

　　

　HTML

　

<div class="time" style="position: absolute; top: 100px; left: 990px;color: #fff;font-size: 24px;">
        <span id="t_d" style="letter-spacing: 6px; margin-left:2px;">00</span>
        <span id="t_h" style="margin-left: 20px;letter-spacing: 8px;">00</span>
        <span id="t_m" style="margin-left: 20px;letter-spacing: 8px;">00</span>
        </div>

 

　　

下面主要讲讲jsonp 跨域的请求

jquery

 

标签：

相关文章