HTML: 

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Countdown Timer</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <div class="container">
    <h1>Countdown Timer</h1>
    <div id="countdown"></div>
  </div>
  <script src="script.js"></script>
</body>
</html>

CSS: 

  body {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
  background-color: #f7f7f7;
}

.container {
  max-width: 400px;
  margin: 20px auto;
  background-color: #fff;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  text-align: center;
}

h1 {
  margin-bottom: 20px;
}

#countdown {
  font-size: 24px;
}

JAVASCRIPT: 

  function countdownTimer() {
  const countDate = new Date('2024-12-31T23:59:59').getTime(); // Change the date to your desired countdown end date
  const now = new Date().getTime();
  const gap = countDate - now;

  const seconds = 1000;
  const minutes = seconds * 60;
  const hours = minutes * 60;
  const days = hours * 24;

  const textDays = Math.floor(gap / days);
  const textHours = Math.floor((gap % days) / hours);
  const textMinutes = Math.floor((gap % hours) / minutes);
  const textSeconds = Math.floor((gap % minutes) / seconds);

  document.getElementById('countdown').innerHTML = `
    <div>${textDays} <span>Days</span></div>
    <div>${textHours} <span>Hours</span></div>
    <div>${textMinutes} <span>Minutes</span></div>
    <div>${textSeconds} <span>Seconds</span></div>
  `;
}

// Update countdown every second
setInterval(countdownTimer, 1000);

// Initial call to start the countdown immediately
countdownTimer();

Try to answer about this code:

What is the purpose of the countdownTimer() function in the JavaScript code?

It displays the current time.
It creates a countdown timer to a specified date.

It sets an alarm for a specific time.
It measures the elapsed time since a specific date.

What does the setInterval(countdownTimer, 1000); statement do in the JavaScript code?

It sets a timeout for the countdown timer.
It calls the countdownTimer() function every second.

It stops the execution of the countdown timer.
It updates the countdown every minute.

In the countdownTimer() function, what does the gap variable represent?

The number of seconds in the countdown.
The difference between the countdown end date and the current time.

The time elapsed since the countdown started.
The total number of milliseconds in the countdown.

Which HTML element is used to display the countdown in the document?

<p>
<div>

<span>
<h1>