嵌套循环仅执行一次

Question

我正在使用JavaScript和jQuery创建一个简单的40x40网格。

这是我嵌套的for循环：

function display_grid() {
  browser_grid = ''
  $visible_grid = $('#grid');

  for (i = 0; i < 40; i++) {
    $visible_grid.append('<div>');
    for (i = 0; i < 40; i++) {
      $visible_grid.append("<div class='square'> </div>");
    }
    $visible_grid.append('</div>');
  }
}

我希望这将创建40个div，每个内部包含40个div。浏览器仅显示40 div的一行。

<div>
    <div class="square></div>
    <div class="square></div>
    <div class="square></div>
    ...
</div>

这是我想要做的，但是四十次。我对JS不太熟悉，所以我对为什么第一个循环没有执行40次感到困惑。

Answer 1

内部循环需要一个不同的变量名。

function display_grid() {
    browser_grid='';
    $visible_grid = $('#grid');

    for(var i=0; i<40; i++){
        $visible_grid.append('<div>');
        for(var j=0; j<40; j++){
            $visible_grid.append("<div class='square'> </div>");
        }
        $visible_grid.append('</div>');
    }

Answer 2

感谢帮助人员！