Search code examples
javascriptloopsforeachcounter

counter loop and increase number on each element


I can't figure it out on this few lines of code. My goal is to make like a book pages numbering: page 01, page 02, page 03, etc...I get only either "0" or "1" or the total of pages.

    let pages = document.querySelectorAll(".page");
Array.from(pages).forEach(page => {
  const Number = document.createElement("span");
  page.appendChild(Number);
  var n = page.length;
  var sum = 0;
  for (var i = 0; i < n; i++) {
    sum += i;
  }
  Number.textContent = sum;
  console.log(sum);
});

Happy sunday


Solution

  • Not sure what your html looks like, but wouldn't the array-index be your page number?

    const pages = document.querySelectorAll(".page");
    
    Array.from(pages).forEach((page, index) => {
      const numberNode = document.createElement("span");
      numberNode.textContent = index + 1;
      page.appendChild(numberNode);
    });