JS_5초 카운트다운 타이머 구현⏱️

---

🏗️ 1. HTML 코드

    <div class="alert alert-danger">
      <span>5</span>초 이내 구매시 사은품 증정!
    </div>

📌 설명
✅ 먼저, 화면에 카운트다운 메시지를 표시할 <div> 태그 만들기
✅ <span> 태그 안의 숫자(5)가 1초마다 줄어든다
✅ 5초 후에는 메시지가 자동으로 사라짐

---

⚡ 2. JavaScript 구현

// 5초 이내 구매시 사은품 증정 알림창 (1초씩 줄어들다가 사라짐)
let countNum = 5;

let interval = setInterval(function () {
  countNum--;

  if (countNum >= 1) {
    document.querySelector(".alert span").innerHTML = countNum; // 숫자 변경
  }
  if (countNum < 1) {
    clearInterval(interval); // 타이머 중지
    document.querySelector(".alert").style.display = "none"; // 메시지 숨기기
  }
}, 1000);

📌 설명
✅ setInterval()을 사용해 1초마다 숫자감소
✅ countNum이 0이 되면 clearInterval()을 사용해 타이머 중지 & 메시지 숨김

---

🎬 3. 실행 결과

✅ 숫자가 줄어들면서 0이되면 팝업창이 사라진걸 확인할수있다

---

👩🏻‍💻 웹사이트 배너 만들기에 아주 유~용한 간단 코드!!