分时问候案例

根据系统不同时间来判断，所以需要用到日期内置对象

    利用多分支语句来设置不同的图片     需要一个图片，并且根据时间修改图片，就需要用到操作元素src属性     需要一个div元素，显示不同问候语，修改元素内容即可  

<script>
    // 1.获取元素
    let img = document.querySelector("img");
    let div = document.querySelector("div");
    //2. 得到当前小时数
    let date = new Date();
    let h = date.getHours();
    console.log(date);
    // 3.判断小时数改变图片和文字信息
    if (h < 12) {
      img.src = "/img/images/4.jpg";
      div.innerHTML = "上午好";
    } else if (h < 18) {
      img.src = "/img/images/3.jpg";
      div.innerHTML = "下午好";
    } else {
      img.src = "/img/images/2.jpg";
      div.innerHTML = "晚上好";
    }
  </script>