Math与Date

Math 对象

    1. Math.random() 0 - 1 之间的随机数
  
    2. Math.pow() 求一个数的多少次方
  
    3. Math.round() 四舍五入
    var num = Math.round(4.5)
    console.log(num); // =>5
 
    4. Math.ceil() 向上取整
    console.log(Math.ceil(9.0001)) //=>10
 
    5.Math.floor() 向下取整
    console.log(Math.floor(9.9999)) //=>9
   
    6. Math.sqrt() 开平方
    console.log(Math.sqrt(9))
    
    7. Math.PI 圆周率
    console.log(Math.PI)
 
    8. Math.abs() 绝对值
    console.log(Math.abs(-6));
 
    9.Math.max() 找出最大的那个数
    console.log(Math.max(1, 4, 5, 7, 8));

    10.Math.min()找出最小的那个数
    console.log(Math.min(1, 4, 5, 7, 8));

Date时间日期对象

    打印现在的时间
    var time = new Date()

    定义一个时间
    var time1 = new Date('2020-8-14 18:00:00')

    获取时间戳  单位是毫秒
    var time = new Date()
    console.log(time.getTime())

    1、 getFullYear() 获取年份
    var year = time.getFullYear()
    console.log(year);

    2、 getMonth() 获取月份 拿到的数字 0 - 11
    var month = time.getMonth()
    console.log(month + 1);

    3、 getDate() 获取日期(多少号)
    var date = time.getDate()
    console.log(date);

    4、 getHours() 获取小时
    var hour = time.getHours()
    console.log(hour);

    5、 getMinutes() 获取分钟
    var minute = time.getMinutes()
    console.log(minute);

    6、 getSeconds() 获取秒
    var second = time.getSeconds()
    console.log(second);

    7、 getMilliseconds() 获取毫秒
    var ms = time.getMilliseconds()
    console.log(ms);

    8、 星期几
    var day = time.getDay()
    console.log(day);


    setInterval() 方法会不停地调用函数,直到窗口关闭。可以在里面写入函数名
       例如我写完一个函数了,我要让他动起来
    setInterval(function() {
            fn()
        }, 1000)    //1000是延迟1秒后


    // 往 p 标签 里面 设置文本
    p1.innerText = str

做一个模拟时钟

完整代码:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<style>
    .box {
        width: 600px;
        height: 600px;
        background: url(demo/images/clock.jpg);
        margin: 0 auto;
        position: relative;
    }
    
    .box img {
        position: absolute;
        left: 50%;
        margin-left: -15px;
    }
</style>

<body>
    <div class="box">
        <img src="demo/images/hour.png" alt="" id="img1">
        <img src="demo/images/minute.png" alt="" id="img2">
        <img src="demo/images/second.png" alt="" id="img3">
    </div>
    <script>
        function run() {
            var time = new Date()
            var hour = time.getHours()
            var minute = time.getMinutes()
            var second = time.getSeconds()
            var ms = time.getMilliseconds()

            img3.style.transform = "rotate(" + (second + ms / 1000) * 6 + "deg)"
            img2.style.transform = "rotate(" + (minute + second / 60) * 6 + "deg)"
            img1.style.transform = "rotate(" + (hour + minute / 60) * 30 + "deg)"
        }
        run()
        setInterval(run)
    </script>
</body>

</html>

先定义一个现在的时间
var time=new Date()
然后需要把时,分,秒都提取出来,单独给他们设置每过一秒旋转的角度,将它们放入函数中,最后使用setInterval() 方法,它会不停地调用函数,不停的获取时间值,函数也会不停的发生改变,所以秒针,分针,时针都在动。

    setInterval(function() {
            fn()
        }, 1000)    //1000是延迟1秒后

做出来就是这样
在这里插入图片描述


制作一个倒计时

完整代码:

Document

<script>
    var time1 = new Date('2020-8-14 18:00:00')
    function fn() {
        var time2 = new Date()
        
        var cha = parseInt((time1.getTime() - time2.getTime()) / 1000)
            //上面得到的是毫秒,所以除了1000后,就是秒
            
            // console.log(cha);
            //现在得到的这个cha 是time1与time2的秒数差值
            
        var day = parseInt(cha / 60 / 60 / 24)
        
        var hour = parseInt((cha - (day * 24 * 60 * 60)) / 3600);
                    //用秒来计算,用总数(秒)减去一天的(秒),然后再转换成小时
        
        var minute = parseInt((cha - (day * 24 * 60 * 60 + hour * 60 * 60)) / 60)
        
        var second = parseInt(cha - (day * 24 * 60 * 60 + hour * 60 * 60 + minute * 60)

        var str = "距离明天吃饭还有" + day + "天" + hour + "小时" + minute + "分" + second + "秒"

        p1.innerText = str
    }
    fn()
    setInterval(function() {
        fn()
    }, 10)
</script>

首先设定一个将来的时间,再设定现在的时间,将它俩的差值算出
var time1 = new Date(‘2020-8-14 18:00:00’)
var time2= newDate()
var cha=parseInt(time1.getTime()-time2.geiTime())
这个差值的单位是毫秒,接着/1000,单位就是秒了,这个差值就是倒计时的总秒数。
再利用总秒数分别算出 天,小时,分,秒
var day=cha/24/60/60
var hour=
最后使用字符串把他们拼接起来
p1.innerText=str

最后让它动起来!
setInterval(function() {
fn()
}, 10)

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值