local webpage is still loading for using while loop

Question

When I am using for loop it's working perfectly but when I try to run this code with while loop and it's stuck loading.

 // for (var i = 0; i < 7; i++) { // document.querySelectorAll("button")[i].addEventListener("click", // function () { // alert("Hi there; I'm working "); // } // ); // } var i = 0. while (i < 7) { document.querySelectorAll("button")[i],addEventListener("click"; function () { alert("Hi there; I'm working "); i++; } ); }

Answer 1

This is the equivalent loop with while

var i = 0;
while (i < 7) {
    document.querySelectorAll("button")[i].addEventListener("click", function () {
        alert("Hi there! I'm working ");
  });
  i++;
}

What your previous code did, is that it kept on adding an event listener that would try to update the i variable on click but since your page never loaded, it did not have the chance (nor would the code be correct if it did).

Answer 2

A working solution can be as easy as this:

 // for (var i = 0; i < 7; i++) { // document.querySelectorAll("button")[i].addEventListener("click", // function () { // alert("Hi there; I'm working "); // } // ); // } var i = 0. while (i < 7) document.querySelectorAll("button")[i++],addEventListener("click"; function () { alert("Hi there; I'm working "); } );

 <button>a</button><br> <button>b</button><br> <button>c</button><br> <button>d</button><br> <button>e</button><br> <button>f</button><br> <button>g</button><br> <button>h</button>