Pattern Program In JavaScript

Square Star Pattern

<html>
    <head>       
    </head>
    <body>        
        <h2 style="color:green;text-align: center;margin-top: 20px;" id="val">Square Pattern Program<hr></h2>
        <div style="color:blue;text-align: center;margin-top: 20px;font-size: 30px" id="output"></div>
    </body>
    <script>
      let n = 5;    
      let string = "";
      for(let i = 0; i < n; i++) { 
        for(let j = 0; j < n; j++) { 
            string += "*";
        }    
        string += "<br>";
     }
     
document.getElementById('output').innerHTML= string;
</script>
</html>

Output:

Hollow Square Star Pattern

<html>
    <head> 
      <title>Hollow Square Patter</title>
    </head>
    <body>        
        <h2 style="color:green;text-align: center;margin-top: 30px;" id="val">Hollow Square Pattern<hr></h2>
        <div style="color:blue;text-align: center;margin-top: 30px;font-size: 30px" id="output"></div>
    </body>
    <script>
      let n = 6;    
      let string = "";
      for(let i = 0; i < n; i++) {          
          for(let j = 0; j < n; j++) { 
              if(i == 0 || i == n-1){
                string += "*";
              }else if(j == 0 || j == n-1){
                string += "*"; 
              }else{
                string += "&nbsp;&nbsp;";
              }
          }    
        string += "<br>";
     }
     
document.getElementById('output').innerHTML= string; 
</script>
</html>

Left Triangle Pattern

<html>
    <head>       
    </head>
    <body>        
        <h2 style="color:green;margin-top: 30px;" id="val">Left Triangle Pattern<hr></h2>
        <div style="color:blue;margin-top: 30px;font-size: 30px" id="output"></div>
    </body>
    <script>
      let n = 5;    
      let string = "";
      for(let i = 1; i <= n; i++) {          
          for(let j = 0; j <i; j++) { 
              string+= "*";
          }
        string += "<br>";
     }
     
document.getElementById('output').innerHTML= string;
console.log(string);
</script>
</html>