Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How Can I change header content with javascript

I am trying to make a very simple welcome page in my site, and I want to greet users with "good morning ….", Taking names is not a thing, but my javascript part is not working, or I can not call it out, so here is my code:

<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>

can anyone help me?, I am new at javascript

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

Javascript functions can only be executed in <script></script> tags.

your header:

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

will thus not execute the greet function, but instead display "greet()".

You can solve this by calling the function inside the script tag, like this:

 <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>

You can also remove the ‘greet()’ from your <h3> tag.

Notice that i’ve placed your "<%=session.getAttribute("user")%>" between quotes.
<%=session.getAttribute("user")%> is server generated. This means it will place its contents (e.g. "John") as raw text. If the quotes wouldn’t be there, you’d get:

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

which would throw a reference error: john is treated as an uninitialized variable.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading