js 获取服务端时间,并实现时钟
本例子以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 获取服务端时间,并实现时钟的更多相关文章
- js获取服务端IP及端口及协议
alert("location:"+window.location); alert("href: "+window.location.href); alert( ...
- 项目开发中的一些注意事项以及技巧总结 基于Repository模式设计项目架构—你可以参考的项目架构设计 Asp.Net Core中使用RSA加密 EF Core中的多对多映射如何实现? asp.net core下的如何给网站做安全设置 获取服务端https证书 Js异常捕获
项目开发中的一些注意事项以及技巧总结 1.jquery采用ajax向后端请求时,MVC框架并不能返回View的数据,也就是一般我们使用View().PartialView()等,只能返回json以 ...
- 微信小程序 客户端时间 与 服务端时间
服务端时间 db.serverDate(); 在操作数据库,上传数据的时候可以使用服务端时间 wx.cloud.init();//初始化云 const db = wx.cloud.database() ...
- Vue 爬坑之路(十一)—— 基于 Nuxt.js 实现服务端渲染(SSR)
直接使用 Vue 构建前端单页面应用,页面源码时只有简单的几行 html,这并不利于网站的 SEO,这时候就需要服务端渲染 2016 年 10 月 25 日,zeit.co 背后的团队对外发布了一个 ...
- 使用DWR实现JS调用服务端Java代码
DWR简介 DWR全称Direct Web Remoting,是一款非常优秀的远程过程调用(Remote Procedure Call)框架,通过浏览器提供的Ajax引擎实现在前端页面的JS代码中调用 ...
- next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器,并用PM2守护程序
前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...
- js 获取当前的时间
第一个小程序,用js获取当前的时间,,比较特殊的是 月是从0开始算的,显示的时候要加1,获取日用getDate(),获取周 getDay(), 直接上代码 <!DOCTYPE html> ...
- asp.net获取服务端和客户端信息
asp.net获取服务端和客户端信息 获取服务器名:Page.Server.ManchineName获取用户信息:Page.User 获取客户端电脑名:Page.Request.UserHostNam ...
- 客户端获取服务端自定义类数据 z
客户端获取服务端自定义类数据 问题一:超时问题,在最后获取数据的时候突然提示服务超时,服务已断开 解决:配置文件添加: <bindings> <wsHttpBinding> & ...
随机推荐
- [Web] About image: MozJPEG
Image is quite heavy in web traffic. it is about 53% whole web traffic. It is important to make sure ...
- Redis-基础介绍
Redis 基础介绍 一.Redis介绍 二.Redis和Memecache的不同 三.Redis的最佳应用场景: 四.Redis支持的键值类型 五.安装Redis 六.Redis启动方式 七.Red ...
- Apache2 服务配置 ubuntu16.04 + django1.11
(步骤) 环境 Ubuntu 16.04 Python 3.5.2 Django 1.11 Apache 2.4 1.Apache2安装 sudo apt-get install apache2 查看 ...
- 前端如何搭建vue UI组件库/封装插件(从零到有)
需求 因之前是做外包项目居多,经常用到相同的组件,之前的办法是在一个项目中写一个组件,其他项目直接将compents下的组件复制,粘贴到项目中使用,缺点是维护起来,改一个项目,其他项目也需要修改,所以 ...
- 【AtCoder】 ARC 103
link C-//// 直接算会出现奇偶两组选了同一个数,注意处理一下就行 #include<bits/stdc++.h> #define ll long long #define dbg ...
- [bzoj 4833]最小公倍佩尔数
传送门 Description Let \((1+\sqrt2)^n=e(n)+f(n)\cdot\sqrt2\) , both \(e(n)\) and \(f(n)\) are integer ...
- 如果要对img里面的值做特殊处理,可以直接写方法
html <img :src="getMore('up')" alt=""> data里面定义的 one: 'http://p1.fishqc.ne ...
- 深度clone和浅clone
首先等你有空的时候可以看这篇,要用可以看我这篇 https://www.cnblogs.com/echolun/p/7889848.html 1.有一点需要明确的是 深拷贝只是针对引用数据类型来说的, ...
- Linux 上配置 SQL Server Always On Availability Group
SQL Server Always On Availability Group 配置步骤:配置三台 Linux 集群节点创建 Availability Group配置 Cluster Resource ...
- 微信小程序之使用wx:for遍历循环
效果图如下: 实现代码如下:type.js: // pages/type/type.js Page({ /** * 页面的初始数据 */ data: { types: "" }, ...