泡面三分钟-你面烂了!

97 阅读1分钟

整个烂活

最近进入到Web API的学习,正好学到间歇函数,看着旁边的泡面陷入了沉思.......

代码:

  <style>
    div {
      font-size: 40px;
      color: red;
    }

    img {
      opacity: 0;
    }
  </style>

<body>
  <h1>泡面三分钟(180s)</h1>
  <div></div>
  <h2></h2>
  <img src="./cat-finger.jpg">
  <script>
    let num = 1
    let div = document.querySelector('div')
    let h2 = document.querySelector('h2')
    let img = document.querySelector('img')
    let timer = setInterval(function timeTravel() {
      div.innerHTML = `${num}s`
      num++
      if (num == 181) {
        clearInterval(timer)
        h2.innerHTML = `泡烂了`
        img.style.opacity = '1'
      }
    }, 1000)
  </script>
</body>

三分钟后:

image.png

本质上是一个时间到了就执行让图片显示出来的烂代码/doge