Math: js的一个内置对象,js为我们提供了一系列的方法让我们使用
取整 parseInt()
保留小数 parseFloat()
1、Math.ceil() 向上取整,有小数直接向上进位
2、Math.floor() 向下取整,有小数直接舍弃
3、Math.round() 四舍五入
4、Math.PI
5、Math.abs() 取绝对值
6、Math.sqrt() 开根号
7、Math.pow(基数,次方数) 次方
8、Math.random() 随机数(0-1之间的数,包含0不包含1)
min-max之间的随机整数: Math.floor(Math.random()*(max-min+1)+min)
// 20-50之间的随机整数 min-max之间的随机整数: Math.floor(Math.random()*(max-min+1)+min)
<script>
setInterval(function(){
console.log(Math.floor(Math.random()*31+20))
},1000)
// 随机打印10个20-50的数
for(var i = 0;i<10;i++) {
console.log(random(20,50));
}
</script>
随机验证码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.box {
width: 60px;
height: 40px;
background: yellow;
line-height: 40px;
text-align: center;
}
</style>
</head>
<body>
<div class="box">sRQ1</div>
<script>
var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
var box = document.getElementsByClassName('box')[0]
box.onclick = function(){
var str1 = ''
for(var i = 0;i < 4; i++){
var random = Math.floor(Math.random()*str.length)
str1 +=str[random]
}
box.innerHTML = str1
}
</script>
</body>
</html>
随机验证码颜色字体变化
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.box {
width: 200px;
height: 100px;
background: yellow;
line-height: 100px;
text-align: center;
}
</style>
</head>
<body>
<div class="box">sRQ1</div>
<!-- <div class="box"><span style="color:rgb(255,0,0);font-size:30px">s</span>RQ1</div> -->
<script>
var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
var box = document.getElementsByClassName('box')[0]
//页面一刷新就得先调用一次随机验证码
randomYZM()
box.onclick = function() {
randomYZM()
}
function randomYZM() {
//随机生成四位的数字|字母---来源于str
var str1 = ''
for(var i = 0;i<4;i++) {
//随机下标
var random = Math.floor(Math.random()*str.length)
// 随机颜色 0-255之间产生
var r = Math.floor(Math.random()*256)
var g = Math.floor(Math.random()*256)
var b = Math.floor(Math.random()*256)
// 随机字号 20-50
var fs = Math.floor(Math.random()*31+20)
str1 += '<span style="color:rgb('+r+','+g+','+b+');font-size:'+fs+'px">'+str[random]+'</span>'
}
// console.log(str1);
box.innerHTML = str1
}
</script>
</body>
</html>
对象
例:var str = new String
日期对象
1、日期对象 Date
(1)创建日期
当前时间: new Date()
var date = new Date()
某个特点时间: new Date('年-月-日 时:分:秒')
var date1 = new Date('2023,02,02 , 00,00,00')
var date1 = new Date('2023-02-02 00:00:00')
var date1 = new Date('2023/02/02 00:00:00')
var date2 = new Date('may,1,2022')
//1、格式化方法 转成一些特定的字符串
<script>
var date1 = new Date()
console.log(date1);
var d1 = date1.toDateString()
console.log(d1); //Tue Dec 06 2022
var d2 = date1.toLocaleDateString()
console.log(d2); //2022/12/6
var d3 = date1.toTimeString()
console.log(d3); //14:26:08 GMT+0800 (中国标准时间)
var d4 = date1.toLocaleTimeString()
console.log(d4); //14:26:08
console.log(d2 +' ' + d4); //2022/12/6 14:26:08
</script>
<script>
var date1 = new Date()
// var date1 = new Date('2022-12-11')
console.log(date1);
var y = date1.getFullYear()
console.log(y); //2022 年
var m = date1.getMonth() + 1
console.log(m); //12 月份需要加1拿到的才是我们实际的
var d = date1.getDate()
console.log(d); //6 日
var d2 = date1.getDay()
var week = ['星期天','星期一','星期二','星期三','星期四','星期五','星期六']
console.log(d2); //星期天0
console.log(week[d2]); //星期
var h = date1.getHours()
console.log(h); //时
var mm = date1.getMinutes()
console.log(mm); //分
var s = date1.getSeconds()
console.log(s); //秒
var time = date1.getTime()
console.log(time); //时间戳(毫秒数) 1970-1-1
</script>
倒计时案例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="box"></div>
<!-- 距离双十二还有多少天多少小时多少分钟多少秒 -->
<script>
var box = document.getElementsByClassName('box')[0]
daojishi()
setInterval(daojishi,1000)
function daojishi(){
//未来时间
var futureDate = new Date('2022-12-12 00:00:00')
//当前时间
var currentDate = new Date()
// console.log(futureDate,currentDate);
//未来时间 - 当前时间 时间戳(单位的毫秒) 1秒 = 1000毫秒
var time = parseInt((futureDate - currentDate) / 1000)
console.log(time); //秒
// 天: 1天 = 24*60*60
var t = parseInt(time / (24*60*60))
console.log(t);
//小时: time % 86400 ----- 不够一天的时间(秒) 1小时 = 60*60
var h = parseInt((time % 86400) / (60*60))
console.log(h);
//分钟 : time % 3600 --- 不够1小时的时间(秒) 1分钟 = 60秒
var m = parseInt((time % 3600) / 60)
console.log(m);
//秒 : time % 60 不到1分钟的时间(秒)
var s = parseInt(time % 60)
console.log(s);
box.innerHTML = '距离双十二还有'+t+'天'+h+'小时'+m+'分钟'+s+'秒'
}
</script>
</body>
</html>