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秒后
做出来就是这样
制作一个倒计时
完整代码:
<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)