Javascript致敬秀

Question

早上好。

請根據小時數顯示敬禮訊息。嘗試了這種自動初始化功能，它可以工作，但獨立於什麼時間，他顯示：「晚安」。我在做什麼錯了？誰能幫忙？

下面是代碼：

(function(){ 

    function saluteText() { 

     var d = new Date(); 
     var time = d.getHours(); 
     var divInnerHTML = document.querySelector('.name'); 

     if (time < 12) { 
      function addInnerHTML() { 
       divInnerHTML.innerHTML = 'Good morning!'; 
      } 
     } 
     else if (time >=12 && time <18) { 
      function addInnerHTML() { 
       divInnerHTML.innerHTML = 'Good evening!'; 
      } 
     } 
     else if (time >= 18 && time < 24) { 
      function addInnerHTML() { 
       divInnerHTML.innerHTML = 'Good night!'; 
      } 
     } 

     addInnerHTML(); 
    } 
    saluteText() 
})(); 

Answer 1

我認爲這是定義你的功能的問題。

當你在javascript中定義一個函數時，它被放在範圍之上。

您定義了三次函數，最後一次只顯示。即使您在If語句之間放置聲明，也會創建所有三個聲明。

您可以通過刪除最後一個功能來嘗試此操作，您將看到代碼顯示'晚上好'。

在這種情況下，解決問題的方法應該是這樣的方法：

function addInnerHTML(message) { 
    divInnerHTML.innerHTML = message; 
} 

if (time < 12) { 

    addInnerHTML('Good morning!'); 
} 
else if (time >=12 && time <18) { 

    addInnerHTML('Good evening!'); 
} 
else if (time >= 18 && time < 24) { 

    addInnerHTML('Good night!'); 
}