如何使用 javascript 更改 header 內容

Question

我正在嘗試在我的站點中創建一個非常簡單的歡迎頁面，我想用“早上好......”來問候用戶，取名字不是一件事，但我的 javascript 部分不起作用，或者我無法打電話它出來了，所以這是我的代碼：

<body style="background-color:rgb(255, 255, 255)">
 

  <h3 style="color: green">
    <%=ServletUtility.getSuccessMessage(request)%>
  </h3>
  <br>
  <h3 class="greeting" id="greeting">
    "greet()"
  </h3>
 <script>
    function greet(){
      var date1=new Date();
      var hour=date1.getHours();
      alert(hour);
      var header = document.getElementById("greeting");
      if(hour>0 && hour <=12){
        header.innerHTML="Good Morning"+" "+ <%=session.getAttribute("user")%>;
      }
      else if (hour >12 && hour <= 18){
        header.innerHTML="Good Afternoon" + " " +<%=session.getAttribute("user")%>;   
      }else if (hour >18 && hour <=22){
        header.innerHTML="Good Evening"+" "+ <%=session.getAttribute("user")%>;
      }else{ 
        header.innerHTML="Good Night"+" "+ <%=session.getAttribute("user")%>;
      }  
  
    
 }
  </script>
</body>

誰能幫助我？，我是 javascript 的新手

Answer 1

Javascript 函數只能在<script></script>標簽中執行。

你的 header：

  <h3 class="greeting" id="greeting">
    "greet()"
  </h3>

因此不會執行問候 function，而是顯示“greet()”。

您可以通過在腳本標簽內調用 function 來解決此問題，如下所示：

 <script>
    function greet(){
      var date1=new Date();
      var hour=date1.getHours();
      alert(hour);
      var header = document.getElementById("greeting");
      if(hour>0 && hour <=12){
        header.innerHTML="Good Morning"+" "+ "<%=session.getAttribute("user")%>";
      }
      else if (hour >12 && hour <= 18){
        header.innerHTML="Good Afternoon" + " " +"<%=session.getAttribute("user")%>";   
      }else if (hour >18 && hour <=22){
        header.innerHTML="Good Evening"+" "+ "<%=session.getAttribute("user")%>";
      }else{ 
        header.innerHTML="Good Night"+" "+ "<%=session.getAttribute("user")%>";
      }  

    
   }
  
   //add this line
   greet();
  </script>

您還可以從<h3>標記中刪除“greet()”。

請注意，我已將您的"<%=session.getAttribute("user")%>"放在引號之間。 <%=session.getAttribute("user")%>是服務器生成的。 這意味着它將其內容（例如“John”）作為原始文本放置。 如果引號不存在，你會得到：

 header.innerHTML="Good Night"+" "+ john;

這會引發參考錯誤： john 被視為未初始化的變量。

Answer 2

我從未使用過 JSP 但我想<%=用於回顯字符串，因此考慮到這一點，我將使用它在 ZC1C425268E68385D1AB5074C17A94 之外生成 javascript 變量，並將該變量作為變量提供給 4 Greet function。 您嘗試調用Greet function 的方法不正確 - function 應該在腳本中或作為內聯事件處理程序，例如onclick=Greet()但這不適用於此處。

 const username='<%=session.getAttribute("user")%>'; const Greet=( user )=>{ let now=new Date(); let hour=now.getHours(); let msg=`Good night ${user}`; if( hour > 0 && hour < 12 )msg=`Good morning ${user}`; else if( hour > 12 && hour < 17 )msg=`Good afternoon ${user}`; else if( hour > 17 && hour < 22 )msg=`Good evening ${user}`; document.querySelector('h3.greeting').textContent=msg; }; Greet( username );

 <h3 class="greeting" id="greeting"></h3>

如何使用 javascript 更改 header 內容

問題描述

2 個解決方案

解決方案1
0 已采納 2022-08-09 08:17:59

解決方案2
-1 2022-08-09 08:19:51

如何使用 javascript 更改 header 內容

問題描述

2 個解決方案

解決方案1 0 已采納 2022-08-09 08:17:59

解決方案2 -1 2022-08-09 08:19:51

解決方案1
0 已采納 2022-08-09 08:17:59

解決方案2
-1 2022-08-09 08:19:51