JavaScriptで時刻と日付を表示する方法

現在の時刻を表示する方法:

// HTML上で時刻を表示する要素を取得
const timeElement = document.getElementById('time');
// 時刻を更新する関数を定義
function updateTime() {
  const now = new Date();
  const hours = now.getHours();
  const minutes = now.getMinutes();
  const seconds = now.getSeconds();
  const timeString = `${hours}:${minutes}:${seconds}`;
  // 要素に時刻を表示
  timeElement.textContent = timeString;
}
// ページが読み込まれた時と毎秒ごとに時刻を更新
updateTime();
setInterval(updateTime, 1000);

上記のコードでは、getElementByIdを使用してHTML上の要素を取得し、new Date()を使用して現在の時刻を取得します。その後、時、分、秒を取得し、文字列として結合して表示します。setInterval関数を使用して、1秒ごとにupdateTime関数を呼び出して時刻を更新します。

現在の日付を表示する方法:

// HTML上で日付を表示する要素を取得
const dateElement = document.getElementById('date');
// 日付を更新する関数を定義
function updateDate() {
  const now = new Date();
  const year = now.getFullYear();
  const month = now.getMonth() + 1; // 月は0から始まるため、+1する
  const day = now.getDate();
  const dateString = `${year}/${month}/${day}`;
  // 要素に日付を表示
  dateElement.textContent = dateString;
}
// ページが読み込まれた時に日付を更新
updateDate();

上記のコードでは、getElementByIdを使用してHTML上の要素を取得し、new Date()を使用して現在の日付を取得します。その後、年、月、日を取得し、文字列として結合して表示します。updateDate関数を呼び出すことで、ページが読み込まれた時に日付を更新します。

以上がJavaScriptを使用して時刻と日付を表示する方法のシンプルな例です。これらのコードを使用することで、ウェブページ上に時刻と日付を表示することができます。