欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

编写js代码,实现根据系统时间显示问候语的功能,通过改变div中的内容,显示不同问候语

程序员文章站 2022-03-19 15:30:50
要求如下:6点之前——凌晨好9点之前——早上好12点之前——上午好14点之前——中午好17点之前——下午好19点之前——傍晚好22点之前——晚上好22点之后包括22点——夜里好

要求如下:
6点之前——凌晨好
9点之前——早上好
12点之前——上午好
14点之前——中午好
17点之前——下午好
19点之前——傍晚好
22点之前——晚上好
22点之后包括22点——夜里好

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

</head>
<body>
    <div></div>
    <script>
      // 根据系统不同时间来判断,所以需要用到日期内置对象
      // 利用多分支语句来设置不同的图片
      // 1.获取元素
      var div = document.querySelector('div');
      // 2. 得到当前的小时数
      var h = new Date().getHours();
      // 3. 判断小时数改变文字信息
      if(h < 6){
        document.write('凌晨好')
      }else if (h < 9){
        document.write("早上好!")
      }else if (h < 12){
        document.write("上午好!")
      }else if (h < 14){
        document.write("中午好!")
      }else if (h < 17){
        document.write("下午好!")
      }else if (h < 19){
        document.write("傍晚好!")
      }else if (h < 22){
        document.write("晚上好!")
      }else {
        document.write("夜里好!")
  }
    </script>
  </body>
  
</html>

本文地址:https://blog.csdn.net/qq_45696288/article/details/110704651

相关标签: js