JS实现简单的天、时、分、秒倒计时代码

2023-11-18

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <title>js简单时分秒倒计时</title>  
    <script type="text/javascript">  
        function countTime() {  
            //获取当前时间  
            var date = new Date();  
            var now = date.getTime();  
            //设置截止时间  
            var endDate = new Date("2016-10-22 23:23:23");  
            var end = endDate.getTime();  
            //时间差  
            var leftTime = end-now;  
            //定义变量 d,h,m,s保存倒计时的时间  
            var d,h,m,s;  
            if (leftTime>=0) {  
                d = Math.floor(leftTime/1000/60/60/24);  
                h = Math.floor(leftTime/1000/60/60%24);  
                m = Math.floor(leftTime/1000/60%60);  
                s = Math.floor(leftTime/1000%60);                     
            }  
             h = h >= 10 ? h : `0${h}`;
             m = m >= 10 ? m : `0${m}`;
             s = s >= 10 ? s : `0${s}`;
            //将倒计时赋值到div中  
            document.getElementById("_d").innerHTML = d+"天";  
            document.getElementById("_h").innerHTML = h+"时";  
            document.getElementById("_m").innerHTML = m+"分";  
            document.getElementById("_s").innerHTML = s+"秒";  
            //递归每秒调用countTime方法,显示动态时间效果  
            setTimeout(countTime,1000);  
  
        }  
    </script>  
</head >  
<body onload = "countTime()">  
    <div>  
        <span id="_d">00</span>  
        <span id="_h">00</span>  
        <span id="_m">00</span>  
        <span id="_s">00</span>  
    </div>  
</body>  
</html>  

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

JS实现简单的天、时、分、秒倒计时代码 的相关文章

  • 如何将一个表单的文件上传字段中的值复制到另一个表单的文本字段?

    我有一页上有两种不同的表格 第一个表单允许用户上传图像文件并通过电子邮件发送 第二个表单根据用户输入生成 URL 为了将图像名称添加到 URL 我需要在第二个表单中有一个字段 该字段从第一个表单的字段中复制图像名称 我不想让用户浏览并选择图
  • 将构造函数传递给 Array.map?

    我怎样才能做这样的事情 var a 1 2 3 4 a map Date constructor 此代码在 Google V8 上引发错误 SyntaxError Unexpected number 我也尝试过 a map Date con
  • 实现快速 Javascript 搜索?

    基本上 我有一个带有文本框的页面和 ul 列在其下面 这 ul 由用户的朋友列表填充 用户开始在文本框中输入朋友的名字 例如按 r 我想立即更新 ul 每次按键仅显示名字以 R 开头的朋友 例如 Richard Redmond Raheem
  • 计算字符串中的唯一单词

    下面我尝试将字符串数组提供给一个函数 该函数将唯一单词添加到单词数组中 并且如果该单词已经在数组中 则增加计数数组中相应元素的计数 var words var counts calculate a b calculate a c funct
  • 使用把手显示来自 parse.com 的 json 响应

    我想将 json 响应传递给车把 我已经查看了解析文档和 stackoverflow 问题 但我似乎无法弄清楚这一点 这是回应 results address 755 W Yale createdAt 2013 02 09T01 12 15
  • 如何将事件对象传递给 JavaScript 中的函数?

  • asp.net 将值从 JS/jquery 传递到 C# 背后的代码

    我已经尝试了 所有 可能的方法 将 screen width vlaue 从 aspx 页面上的 JS 脚本发送到后面代码中的 c 虽然我可以看到 screen width 被正确分配 但它永远不会分配给我的隐藏字段价值
  • 尝试注册 RCTBridgeModule 类 RCTFileReaderModule

    尝试为名称 FileReaderModule 注册 RCTBridgeModule 类 RCTFileReaderModule 但该名称已由类 FileReaderModule 注册 尝试使用命令react native run ios在i
  • 是否可以进行条件解构或有后备?

    我有一个具有许多深层嵌套属性的对象 我希望能够访问 MY KEY 上的属性 如下 但如果该属性不存在 则获取 MY OTHER KEY 我怎样才能做到这一点 const X Y MY KEY Values segments segment
  • 如何在 HTML 表格上使用分页?

    我正在尝试使用这个分页library http flaviusmatis github io simplePagination js 在我的 HTML 表格页面 特别是浅色主题 中 但不知何故 我无法理解如何在我的 HTML 页面中以这种方
  • 从 html5

    我正在寻找一种方法来根据用户代理字符串将控件属性添加到视频标签 我不希望在 iPad 和 Android 之外的任何浏览器或设备上出现控件属性 所以我认为用户代理是最好的识别方法 因为 ipad 和 android 一词出现在各自的 UA
  • 如何在 Angular 2 应用程序中使 DateAdapter 单例?

    我正在开发一个带有延迟加载模块的 Angular 7 应用程序 我也使用有角度的材料组件 我想在日期选择器组件中本地化并支持多个区域设置 当应用程序语言发生变化时 我想在整个应用程序中全局更改它 可以通过 DateAdapter setLo
  • Intro.js 2页然后返回首页

    我在用intro js http introjs com 为我的网站创建一个小介绍 我希望游览从第 1 页 主页 2 另一页 然后回到第 1 页 主页 我已经成功地从第 1 2 页开始 但不确定如何让它返回到第 1 页 我对 javascr
  • 如何使用 jest 通过 Promise.all 设置多次提取测试

    我在测试中使用 jest 我正在使用 React 和 Redux 并且执行以下操作 function getData id notify return dispatch gt dispatch anotherFunction Promise
  • Facebook API Javascript JSON 响应

    function getUser FB api me function response console log Response is response alert Your name is response first name ale
  • 如何显示 GroupList 的 FormArray?

    我正在尝试制作一个交互式表单 在每一行上列出一个项目以及一个删除按钮 在我的示例中称为 verwijderen 这些项目是从数据库中检索的 并且每个项目都实例化为名为的自定义对象LaborPeriod 然后这些对象被转化为FormGroup
  • 模拟节点外部模块默认使用 jest 的链式方法

    在我们的节点 CLI 中 我们有一个简单的方法 use strict const ora require ora module exports function startSpinner textOnStart color spinnerT
  • 如何使用 Jquery .animate() 函数创建连续滚动内容? [复制]

    这个问题在这里已经有答案了 可能的重复 在jquery中实现圆形滚动条 https stackoverflow com questions 812049 implementing circular scroller in jquery 我想
  • Socket.io 与服务器离线连接

    如何检测服务器是否离线或由于其他原因无法连接 我的代码看起来像这样 this socket io connect connectionInfo reconnect false 它不会抛出任何错误 因此 try catch 子句不起作用 Us
  • 有没有办法从画布上清除一个元素而不消除其他元素?

    我正在使用画布构建页面加载器 并使用 es6 类 虽然目前我无法使其正常工作 原因之一是我找不到清除画布的方法进展 到目前为止 这是我的代码 class Loader constructor width height this width

随机推荐

  • docke的基础入门

    docker基础入门操作 一 如何安装docker 一 如何安装docker 安装docker命令通过一下命令顺序执行 即可进行安装 校验操作系统内核版本 要求是3 10以上的版本 1 安装一些必要的系统工具 其中yum utils包含yu
  • 由于找不到vcomp140.dll无法继续执行此代码?该怎么修复呢?

    在使用计算机过程中 我们有时会遇到缺少vcomp140 dll文件的问题 这可能导致某些应用程序无法正常运行 遇到了缺少vcomp140 dll文件的问题 这给我的正常工作和娱乐带来了一些困扰 经过一番努力 我成功修复了这个问题 并对此总结
  • shell中括号的特殊用法 linux if多条件判断

    shell中括号的特殊用法 linux if多条件判断 一 bash 单双括号 基本要素 两个符号左右都要有空格分隔 内部操作符与操作变量之间要有空格 如 a b 字符串比较中 gt lt 需要写成 gt lt 进行转义 中字符串或者 变量
  • Cause: org.jetbrains.plugins.gradle.tooling.util.ModuleComponentIdentifierImpl.getM的原因及解决办法

    一 原因 从别人那里拿来的gradle项目 然后自己用idea跑的时候报错 Cause org jetbrains plugins gradle tooling util ModuleComponentIdentifierImpl getM
  • linux 解锁用户被锁

    一般我们在开发时部署好了环境 有时候用xshell 登录服务器时我们经常会忘记用户的登录密码 我们经常会遇到用户被锁定 首先 用root 用户查看 查看被锁用户的错误登录次数 pam tally2 u tom tom 为用户 pam tal
  • qt集成cef QWidget

    编译libcef dll wrapper 假设你已经编译出了libcef dll wrapper lib Debug和Release版本 并且对应版本的程序集类型分别是 MDd和MD qt的运行时库是MDd类型的 因此cef3编译的时候也应
  • hive 异常之 MetaException

    直接启动hive后 hive gt show databases FAILED SemanticException org apache hadoop hive ql metadata HiveException java lang Run
  • vue3中对本地存储的数据多次修改并实时页面显示

    背景 项目中遇到切换用户时 对App页面的信息进行实时显示 登录时存储一次 切换时再次存储 解决办法 1 在每次存储的同时存储到pinia中 可解决实时显示问题 import useCommonStore from pinia ls set
  • 软件测试中的43个功能测试点总结

    功能测试就是对产品的各功能进行验证 根据功能测试用例 逐项测试 检查产品是否达到用户要求的功能 针对web系统的常用测试方法如下 1 页面链接检查 每一个链接是否都有对应的页面 并且页面之间切换正确 可以使用一些工具 如LinkBotPro
  • C++学习(四八七)android studio println的输出位置

    程序中调用如下输出 System out println haha1 调试情况下 在Run和LogCat下均看不到输出 运行情况下 在Run下能看到输出 建议如下 可在LogCat中看到信息 android util Log常用的方法有以下
  • 蓝牙之十三-HFPclient JNI层

    JNI到app JAVA
  • 开营

    2021未来杯区块链应用创新大赛已于9月24日正式启动 本届大赛是由中国信息协会主办 中国信息协会教育分会 艾肯文化传媒 北京 有限公司 中软国际教育科技集团 以太坊行星承办 北京大学研发实验服务基地 iCAN国际联盟 STEERTECH科
  • echarts修改折线图样式,总结踩坑以及常用

    以折线图为例 最终呈现的效果是这样的 在最外层可以设置 距离外层box的距离 myChart setOption grid 距离外层box左右位置 x 30 左 y 45 上 x2 45 右 y2 40 下 borderWidth 1 在x
  • 【WSN无线传感器网络恶意节点】使用 MATLAB 进行无线传感器网络部署研究

    欢迎来到本博客 博主优势 博客内容尽量做到思维缜密 逻辑清晰 为了方便读者 座右铭 行百里者 半于九十 本文目录如下 目录 1 概述 2 运行结果 3 参考文献 4 Matlab代码实现 1 概述 在无线传感器网络部署方面 您计划在一个 1
  • React重新渲染的触发机制及其优化策略

    React是一个用于构建用户界面的JavaScript库 它的核心特点之一是使用虚拟DOM Virtual DOM 来实现高效的组件渲染 那组件重新渲染的机制是如何呢 基于这些机制 如果进行优化呢 虚拟DOM是一个用JavaScript对象
  • 逆向破解学习-登山赛车

    试玩 课程中的内容 Hook代码 import de robv android xposed XC MethodHook import de robv android xposed XposedHelpers import de robv
  • React Router 路由守卫

    React Router 路由守卫 组件内路由守卫 1 下面是使用高阶组件实现路由守卫的示例代码 import React from react import Route Redirect from react router dom con
  • C++设计模式(8)——命令模式

    命令模式 亦称 动作 事务 Action Transaction Command 意图 命令模式是一种行为设计模式 它可将请求转换为一个包含与请求相关的所有信息的独立对象 该转换让你能根据不同的请求将方法参数化 延迟请求执行或将其放入队列中
  • 奇安信笔试C++

    LSA LSA 链路状态通告 是链接状态协议使用的一个分组 它包括有关邻居和通道成本的信息 LSA被路由器接收用于维护它们的路由选择表 LSA Link State Advertisement ip报文最大长度 单看IP层的话 报文头部的
  • JS实现简单的天、时、分、秒倒计时代码