javascript按鈕開關燈案例

以下是一個簡單的JavaScript按鈕開關燈案例：

HTML代碼：

< button id="switch" >開關燈< /button >
< p id="status" >當前狀態：熄滅< /p >

JavaScript代碼：

let status = "熄滅";
const switchButton = document.getElementById("switch");
const statusDisplay = document.getElementById("status");

switchButton.addEventListener("click", function() {
  if (status === "熄滅") {
    status = "亮起";
    switchButton.innerHTML = "開關燈";
    statusDisplay.innerHTML = "當前狀態：" + status;
    // 在這里添加點亮燈的代碼
  } else {
    status = "熄滅";
    switchButton.innerHTML = "開關燈";
    statusDisplay.innerHTML = "當前狀態：" + status;
    // 在這里添加關閉燈的代碼
  }
});

在這個案例中，我們創建了一個按鈕，當用戶點擊按鈕時，會觸發一個事件監聽器。如果當前狀態為“熄滅”，則將狀態設置為“亮起”，按鈕文字為“開關燈”，狀態顯示為“當前狀態：亮起”，然后在代碼中添加點亮燈的代碼。如果當前狀態為“亮起”，則將狀態設置為“熄滅”，按鈕文字為“開關燈”，狀態顯示為“當前狀態：熄滅”，然后在代碼中添加關閉燈的代碼。