返回顶部
首页 > 资讯 > 前端开发 > VUE >js如何实现日期计算器功能
  • 677
分享到

js如何实现日期计算器功能

2024-04-02 19:04:59 677人浏览 安东尼
摘要

这篇文章主要为大家展示了“js如何实现日期计算器功能”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“js如何实现日期计算器功能”这篇文章吧。日期计算器html代码

这篇文章主要为大家展示了“js如何实现日期计算器功能”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“js如何实现日期计算器功能”这篇文章吧。

日期计算器html代码片段:

<!doctype html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>日期计算器</title>
 <script type="text/javascript" src="date_calc.js"></script>
</head>
<body>
<br><br>
<b>推算几天后的日期:</b>
<br>
 和
<input size="8" id="SY" value="2016">年
<input size="4" id="SM" value="11">月
<input size="4" id="SD" value="16">日
(缺省为今天)
<br>相差
<input size="8" id="decday" value="100">天
(输入负数则往前计算)
<br>是:
<span id="result1"></span>
<br>
<input type=button value="计算" onclick="cala()">

<br>


<b>计算日期差:</b>
<br>

  <input size="8" id="SY2" value="2016">年
<input size="4" id="SM2" value="11">月
<input size="4" id="SD2" value="16">日

<br>
和 <input size="8" id="SY3" value="2017" >年
<input size="4" id="SM3" value="1">月
<input size="4" id="SD3" value="1">日
<br>相差:
<span id="result2"></span>天
<br>
<input type=button value="计算" onclick="calb()">
<br>
</body>

</html>

date_calc.js代码片段:

var hzWeek= new Array("日","一","二","三","四","五","六","日");

//获取星期
function cweekday(wday)
{return hzWeek[wday];}


function cala()
{
y=document.getElementById("SY").value;
m=document.getElementById("SM").value;
d=document.getElementById("SD").value;
DDD=document.getElementById("decday").value;

ttt=new Date(y,m-1,d).getTime()+ddd*24000*3600;

theday=new Date();
theday.setTime(ttt);

document.getElementById("result1").innerHTML=theday.getFullYear()+"年"+(1+theday.getMonth())+"月"+theday.getDate()+"日"+"星期"+cweekday(theday.getDay());


}


function calb()
{

y2=document.getElementById("SY2").value;
m2=document.getElementById("SM2").value;
d2=document.getElementById("SD2").value;


y3=document.getElementById("SY3").value;
m3=document.getElementById("SM3").value;
d3=document.getElementById("SD3").value;


day2=new Date(y2,m2-1,d2);
day3=new Date(y3,m3-1,d3);

document.getElementById("result2").innerHTML=(day3-day2)/86400000;


}

以上是“js如何实现日期计算器功能”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注编程网VUE频道!

--结束END--

本文标题: js如何实现日期计算器功能

本文链接: https://lsjlt.com/news/66006.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • js如何实现日期计算器功能
    这篇文章主要为大家展示了“js如何实现日期计算器功能”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“js如何实现日期计算器功能”这篇文章吧。日期计算器html代码...
    99+
    2024-04-02
  • js中如何实现计算器功能
    这篇文章将为大家详细讲解有关js中如何实现计算器功能,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。代码如下:<!DOCTYPE html> ...
    99+
    2024-04-02
  • js版实现计算器功能
    本文实例为大家分享了js实现计算器功能的具体代码,供大家参考,具体内容如下 在老师的带领下完成了这个简单的计算器,这是一个神奇的过程,计算器的基本功能都是有的。虽然是个简单的计算器,...
    99+
    2024-04-02
  • js+css实现计算器功能
    本文实例为大家分享了js+css实现计算器功能的具体代码,供大家参考,具体内容如下 目前仅实现了最基础的运算功能 (因为是js的运算内核,有些小数点计算并不准确,懒得去做去小数点后几...
    99+
    2024-04-02
  • js如何实现简单的计算器功能
    这篇文章主要介绍js如何实现简单的计算器功能,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!示例代码:<!DOCTYPE html>...
    99+
    2024-04-02
  • js实现计算器和计时器功能
    本文实例为大家分享了js实现计算器和计时器的具体代码,供大家参考,具体内容如下 完成简单的计算器 <!DOCTYPE html> <html>     <...
    99+
    2024-04-02
  • js如何实现日历功能
    这篇文章给大家分享的是有关js如何实现日历功能的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。突然发现日期对象可以进行 加减 , 利用这个特性写了一个可以说是对只要会JavaScr...
    99+
    2024-04-02
  • javascript如何实现计算器功能
    这篇文章给大家分享的是有关javascript如何实现计算器功能的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。1、计算器功能介绍可以实现数据的加(+),减(-),乘(*),除(/),取余运算(%),以及实现数据的...
    99+
    2023-06-25
  • 原生JS实现简单计算器功能
    本文实例为大家分享了JS实现简单计算器功能的具体代码,供大家参考,具体内容如下 使用html和css写出计算器的基本结构和样式,用原生JS实现计算器的加减乘除运算功能,只能计算简单的...
    99+
    2024-04-02
  • 如何用js实现日历功能
    这篇文章主要讲解了“如何用js实现日历功能”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“如何用js实现日历功能”吧! 示例代码...
    99+
    2024-04-02
  • JS如何实现计算器
    这篇文章将为大家详细讲解有关JS如何实现计算器,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。代码:<!DOCTYPE html> <html&...
    99+
    2024-04-02
  • js如何实现秒表计时器功能
    这篇文章主要介绍了js如何实现秒表计时器功能,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。效果图: 下面贴代码:<!DOCT...
    99+
    2024-04-02
  • 如何计算Java日期
    小编给大家分享一下如何计算Java日期,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!Date 类  Date类可以在java.util包中找到,用一个l...
    99+
    2023-06-03
  • QT如何实现简单计算器功能
    这篇文章主要讲解了“QT如何实现简单计算器功能”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“QT如何实现简单计算器功能”吧!效果图:新建工程,创建类MainWindow,基类是QMainWi...
    99+
    2023-06-30
  • 原生JS怎么实现简单计算器功能
    本篇内容主要讲解“原生JS怎么实现简单计算器功能”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“原生JS怎么实现简单计算器功能”吧!使用html和css写出计算器的基本结构和样式,用原生JS实现计...
    99+
    2023-06-29
  • JavaScript+HTML5如何实现日期比较功能
    这篇文章主要介绍JavaScript+HTML5如何实现日期比较功能,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!代码:<!DOCTYPE HTML> <...
    99+
    2024-04-02
  • Visual Studio.NET如何实现插入日期功能
    这篇文章将为大家详细讲解有关Visual Studio.NET如何实现插入日期功能,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。这个例子非常简单,只需要你修改一个在前面列出来的那个Exec函数。通过前面章...
    99+
    2023-06-17
  • IO实现计算器功能
    本文实例为大家分享了IO实现计算器功能的具体代码,供大家参考,具体内容如下 代码: // // ViewController.m // Fraction_Calculato...
    99+
    2022-05-27
    IOS 计算器
  • C++实现计算器功能
    本文实例为大家分享了C++实现计算器功能的具体代码,供大家参考,具体内容如下 说明: 前面简单尝试过计算器,只能支持加减乘除,这次完善了计算器的功能:支持带括号的表达式;支持&plu...
    99+
    2024-04-02
  • C#实现计算器功能
    本文实例为大家分享了C#实现计算器功能的具体代码,供大家参考,具体内容如下 在刚刚接触c#的时候,就想做一个简单加减乘除计算器。这就是目标,可惜一直没有动手去做,今天特意把它简单做了...
    99+
    2024-04-02
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作