How can I print a function from JavaScript to html

Question

I'm trying to make a out of '*' and I got the code right because it works in the console but when I try to print it in the html document it does not work

function Pyramid() {
    let rows = 9;
    let output = '';
    for (let i = 1; i <= rows; i++) {
        for (let j = 1; j <= i; j++) {
            output += '*  ';
        }
        console.log(output);
        return output;
        output = '';
    }
}
document.getElementById('pyramid').textContent = generatePyramid();

<body>
    <div id="pyramid"></div>
    <script src="../script.js/script.js"></script>
</body>

Answer 1

Try this

document.getElementById("pyramid").innerHTML='generatePyramid()';

Answer 2

Okay, so there are a few minor issues here.

Your function is called Pyramid but you are calling generatePyramid .
You are returning at the end of the first row because return output is within the for loop.
In the console you are outputting using console.log which will give you a row in the console... however for the HTML you are just dumping it all so it would be a continuous row of stars instead of one row at a time.

In the code below I've fixed these issues and made it so it outputs each row in a <p> . There are numerous ways to achieve this result and improve upon it, but I think this is what you were aiming for.

function generatePyramid() {
  let rows = 9;
  let output = "";
  for (let i = 1; i <= rows; i++) {
    output += "<p>";
    for (let j = 1; j <= i; j++) {
      output += "* ";
    }
    output += "</p>";
  }
  return output;
}

document.getElementById("pyramid").innerHTML = generatePyramid();

How can I print a function from JavaScript to html

Question

2 answers

solution1
0 2022-04-29 09:52:52

solution2
0 ACCPTED 2022-04-29 09:54:48

How can I print a function from JavaScript to html

Question

2 answers

solution1 0 2022-04-29 09:52:52

solution2 0 ACCPTED 2022-04-29 09:54:48

solution1
0 2022-04-29 09:52:52

solution2
0 ACCPTED 2022-04-29 09:54:48