HTML Code

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Star Pattern 9 - Try It</title>
</head>
<body>
  <h1>Hollow Diamond Star Pattern</h1>
  <p>Open the HTML code and change <code>rows</code>, then click Run.</p>

  <pre id="output"></pre>

  <script>
    (() => {
      // Change this value to try different sizes
      const rows = 5;

      function buildRow(i, rows) {
        let line = "";
        for (let s = 1; s <= rows - i; s++) line += " ";
        line += "*";

        if (i > 1) {
          for (let g = 1; g <= 2 * i - 3; g++) line += " ";
          line += "*";
        }

        return line;
      }

      let result = "";
      for (let i = 1; i <= rows; i++) result += buildRow(i, rows) + "\n";
      for (let i = rows - 1; i >= 1; i--) result += buildRow(i, rows) + "\n";

      document.getElementById("output").textContent = result;
    })();
  </script>
</body>
</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

JavaScript Star Pattern 9 (Try It)