本例子以vue语法伪代码书写:

1,获取服务端北京时间

getRealTime() {
let that = this;
var xhr = new XMLHttpRequest();
if( !xhr ){
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open("HEAD",location.href,true);
xhr.onreadystatechange=function(){
if( xhr.readyState == 4 && xhr.status == 200 ){
that.nowTime = xhr.getResponseHeader("Date");
that.changeTime();
}
}
xhr.send(null);
}

2,实现闹钟走动

changeTime() {
let that = this;
if(that.nowTime){
setInterval(() => {
var t = new Date(that.nowTime).getTime();
t += 1000;
that.nowTime = new Date(t).pattern('yyyy-MM-dd HH:mm:ss');
}, 1000);
}
}

3,页面使用

<div>北京时间:{{nowTime}}</div>

js 获取服务端时间,并实现时钟的更多相关文章

  1. js获取服务端IP及端口及协议

    alert("location:"+window.location); alert("href: "+window.location.href); alert( ...

  2. 项目开发中的一些注意事项以及技巧总结 基于Repository模式设计项目架构—你可以参考的项目架构设计 Asp.Net Core中使用RSA加密 EF Core中的多对多映射如何实现? asp.net core下的如何给网站做安全设置 获取服务端https证书 Js异常捕获

    项目开发中的一些注意事项以及技巧总结   1.jquery采用ajax向后端请求时,MVC框架并不能返回View的数据,也就是一般我们使用View().PartialView()等,只能返回json以 ...

  3. 微信小程序 客户端时间 与 服务端时间

    服务端时间 db.serverDate(); 在操作数据库,上传数据的时候可以使用服务端时间 wx.cloud.init();//初始化云 const db = wx.cloud.database() ...

  4. Vue 爬坑之路(十一)—— 基于 Nuxt.js 实现服务端渲染(SSR)

    直接使用 Vue 构建前端单页面应用,页面源码时只有简单的几行 html,这并不利于网站的 SEO,这时候就需要服务端渲染 2016 年 10 月 25 日,zeit.co 背后的团队对外发布了一个 ...

  5. 使用DWR实现JS调用服务端Java代码

    DWR简介 DWR全称Direct Web Remoting,是一款非常优秀的远程过程调用(Remote Procedure Call)框架,通过浏览器提供的Ajax引擎实现在前端页面的JS代码中调用 ...

  6. next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器,并用PM2守护程序

    前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...

  7. js 获取当前的时间

    第一个小程序,用js获取当前的时间,,比较特殊的是 月是从0开始算的,显示的时候要加1,获取日用getDate(),获取周 getDay(), 直接上代码 <!DOCTYPE html> ...

  8. asp.net获取服务端和客户端信息

    asp.net获取服务端和客户端信息 获取服务器名:Page.Server.ManchineName获取用户信息:Page.User 获取客户端电脑名:Page.Request.UserHostNam ...

  9. 客户端获取服务端自定义类数据 z

    客户端获取服务端自定义类数据 问题一:超时问题,在最后获取数据的时候突然提示服务超时,服务已断开 解决:配置文件添加: <bindings> <wsHttpBinding> & ...

随机推荐

  1. BM递推杜教版【扩展】

    也就是模数不是质数的时候, //下面的板子能求质数和非质数,只需要传不同的参数. #include <cstdio> #include <cstdlib> #include & ...

  2. TED演讲:别不信,你只需20个小时,就能学会任何事情!

    https://www.bilibili.com/video/av50668972/?spm_id_from=333.788.videocard.3 two years ago, my life ch ...

  3. 数据库服务器和web服务器磁盘占用查询

    对于Oracle数据库而言磁盘空间主要体现在表空间上,可使用sql语句进行查看Oracle 表空间的大小及使用情况: select sum(bytes)/1024/1024/1024 "Gb ...

  4. scylladb docker-compose 用户密码认证配置

    scylladb 对于用户的认证配置还是比较简单的,以下是一个docker-compose 配置的说明 环境准备 docker-compose 文件 version: "3" se ...

  5. hasura skor 一个pg 的event trigger 扩展

    hasura skor 是一个hasura 团队早期的event triggerpg 扩展,新的推荐使用graphql engine 参考架构 缺点 只有在skor 运行的时候,数据才可以被捕捉处理 ...

  6. zeptojs库

    一.简介 ①Zepto是一个轻量级的针对现代高级浏览器的JavaScript库, 它与jquery有着类似的api. ②Zepto的设计目的是提供 jQuery 的类似的API,但并不是100%覆盖 ...

  7. Mysql 多表连接查询 inner join 和 outer join 的使用

    JOIN的含义就如英文单词“join”一样,连接两张表,大致分为内连接,外连接,右连接,左连接,自然连接.这里描述先甩出一张用烂了的图,然后插入测试数据. 首先先列举本篇用到的分类(内连接,外连接,交 ...

  8. 了解Python-白 驹 过 隙 , 忽 然 而 已

    白 驹 过 隙 , 忽 然 而 已 人 生 苦 短,我 用 Python -- Life is short , you need Python 代码量少,同一样问题 ,用不同的语言解决时,一般情况下P ...

  9. mac百度网盘破解版

    以下资源来源于网络收集分享,如有问题请联系我删除!来源入口,后面链接挂了,可去原网址访问! 还在为Mac百度网盘下载速度慢而烦恼吗?百度云盘又是一个非常实用的分享工具,可支持图片.视频.音乐.文档.种 ...

  10. rust 函数的使用

    fn main() { println!("Hello, world!"); another_function(2,3); let y ={ let x =3; //表达式的结尾没 ...