js写出的倒计时显示中，页面与使用js 判断游览器器[检查] 差一秒是为什么？详细请看图

来源：蜘蛛抓取(WebSpider) 时间：2018-05-20 16:43 标签： js倒计时60秒页面显示
手机版网页js倒计时存在的问题与解决的方法作者
发表于 ，最后修改于 在手机版网页中做倒计时（使用服务端时间来倒计时）我们需要考虑到两个问题：1、避免频繁的取服务端时间，2、手机处于锁屏状态或者浏览器/页面在后台运行对倒计时的处理；围绕这两个问题说说我的解决方法（小 虾虎 鱼原创）。一、服务端时间的获取方法实现倒计时功能，我们必须要知道剩余时间，知道剩余时间就必须要知道当前时间（服务器时间）和结束时间。 服务器时间和结束时间可以通过两种方式获得：后端直接在视图中输出；通过ajax去获取；为了减少http请求我选择第一种方式，将结束时间和服务端时间直接在视图中输出，如：&head&
var servertime = ' 09:32:17';
var endtime = ' 09:00:00';
得到两个时间之后，结束时间endtime是一直不变的，但服务器时间servertime是一直在变的，而我们只得到了一次服务器时间，这时我们需要实现如何与服务器时间同步，我们可以这样做： 在页面打开时我同时记录这一刻的时间，并将这时间保存到一个变量instant中，然后在页面打开后的任一时间想得到服务端的时间可以通过当前本地的时间减去instant的时间再加上servertime时间，即：Date.now() - instant + servertime，我们将下面的js代码放到html页面中的head中（放到head中instant与servertime是同时定义可以减少误差）：
var servertime = ' 09:32:17';
var endtime = ' 09:00:00';
var instant = Date.now();
最后我们通过Date.now() - instant + servertime计算时间差来实现倒计时。【注意】使用此方法会存在以下问题：如果客户端的时间被修改，那么得到的服务端时间就不正确；如果网络环境差也会造成一定的误差；二、设备锁屏或浏览器/页面后台运行的影响如果设备处于锁屏或者浏览器/页面处于后台运行状态过一段时间再返回到页面，会发现倒计时慢了（具体原因我不知道，有可能浏览器处于休眠状态导致JS的执行暂停，纯属猜测），这时我们需要对倒计时进行校正，对于这个问题我也有两种解决方法：使用定时器隔一段时间自动校正一次；使用visibilitychange事件来监听document的隐藏状态，即查看document.hidden值，false为页面显示，true为页面隐藏：document.addEventListener(&visibilitychange&, function (e) {
if(!e.path[0].hidden){ // e.path为页面中document的集合
// 校正倒计时的代码...
}, false);
第一种方法随可行但有一定的弊端，建议使用第二种方法。至此，手机版网页js倒计时的两个问题得到了解决。如何设置一个DIV在网页中显示几秒然后自动隐藏消失？_百度知道
如何设置一个DIV在网页中显示几秒然后自动隐藏消失？
打开一个网页，显示一个含有图片的div,比如广告，如何设置这个div再打开网页后显示几秒然后自动隐藏消失呢，麻烦大神能给出详细代码，不胜感激！
我有更好的答案
//简单的用dom实现&html&&title&test&/title&&body&&div id=&test&&test&/div&&script&setTimeout(function(){document.getElementById(&test&).style.display=&none&;},1000);//1000是多久被隐藏，单位毫秒&/script&&/body&&/html&//用jquery实现&html&&title&test&/title&&body&&script&$(document).ready(function(){//页面加载完之后，自动执行该方法
setTimeout(function(){$(&#test&).hide();},2000);//2秒后执行该方法}); &/script&&div id=&test&&test&/div&&/body&&/html&
采纳率：79%
$(&yourDiv&).show()//显示你的DIVwindow.setTimeout(&$('yourDiv').hide()&,3000);//3000毫秒后，隐藏你的DIV
为您推荐：
其他类似问题
自动隐藏的相关知识
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。JS中怎样用for循环做个文字倒计时出现的小程序、 就是隔几秒出现一个文字、_百度知道
JS中怎样用for循环做个文字倒计时出现的小程序、 就是隔几秒出现一个文字、
这是我写的代码、有问题的 ，帮忙修改下、谢谢！
&title&无标题文档&/title&
&script type=&text/javascript&&
var arrs=[&隔&,&几&,&秒&,&出&,&现&,&一&,&个&,&文&,&字&,&、&]
function operA(){
var divObj=document.getElemen...
我有更好的答案
你应该使用&setInterval，而不是&setTimeout，for&用不上&script type="text/javascript"&var arrs=["隔","几","秒","出","现","一","个","文","字","、"];var i=0;function operA() {
setInterval(function() {
if(i == arrs.length) {
document.getElementById("divA").innerHTML += arrs[i];
}, 50);}&/script&
采纳率：77%
你思维都是混乱的，其实不用for循环，单用计时函数相互调用就可以实现循环（给个分支判断语句，判定是否是否继续）
为您推荐：
其他类似问题
您可能关注的内容
for循环的相关知识
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。

我要回帖

更多关于 js倒计时60秒页面显示 的文章

 

随机推荐