<!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></title>
<style>
div {
width: 300px;
height: 30px;
line-height: 30px;
color: blue;
background-color: blue;
}
</style>
</head>
<body>
<button>显示当前系统的时间</button>
<div></div>
<script>
//当我们点击了按钮.div里面的文字会发生变化
//1.获取元素
let btn = document.querySelector('button');
let div = document.querySelector('div');
//2.注册事件
btn.onclick = function(){
div.innerText = getTime1();
}
function getTime1(){
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth()+1;
var date1 = date.getDate();
var arr = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'];//添加数组的目的是因为，getDay函数返回的数值位数字，需要把数字对应到字符串星期几
var day = date.getDay();//周日返回的是0，所以上一行代码要把周日放在第0位
var hours = date.getHours();//获得小时数
hours = hours < 10 ? '0' + hours:hours;//如果小时数小于10，前面加0，例如6时，表达为06，三元表达式；
var minute = date.getMinutes();//获得分钟数
minute = minute < 10 ? '0' + minute : minute
var seconds = date.getSeconds();//获得秒数
seconds = seconds < 10 ? '0' + seconds : seconds;
return '北京时间:'+year+'年'+month+'月'+date1+'日'+arr[day]+hours+':'+minute+':'+seconds;
}
//元素可以不用添加事件
var p = document.querySelector('p');
p.innerText = getTime1();
</script>
</body>
</html>
4169
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
