問題描述

我自己寫了一個函數(shù)，用來創(chuàng)建多行多列的表格，但是寫完發(fā)現(xiàn)只能創(chuàng)建一行多列。

<p id='game-box'></p> <script> var Tab=createGrids(16,10); var gameBox=document.getElementById('game-box'); gameBox.appendChild(Tab); // 創(chuàng)建網(wǎng)格 function createGrids(row,col) {var Tab=document.createElement('table');var Tbody=document.createElement('tbody');var i=0,j=0;while(i<row) { var Tr=document.createElement('tr'); while(j<col) {var Td=document.createElement('td');Tr.appendChild(Td);j++; } Tbody.appendChild(Tr); i++;}Tab.appendChild(Tbody);return Tab; } </script>

問題解答

因為你第一遍運行 while(i<row) 的結(jié)束時候 while(j<col)中的 j 已經(jīng)是10了哦，所以，第二遍循環(huán) i以后，創(chuàng)建的tr里面都是沒有 td 的，因為沒有走進while(j<col) 嘛，

你可以改成這樣子

<p id='game-box'></p> <script> var Tab=createGrids(16,10); var gameBox=document.getElementById('game-box'); gameBox.appendChild(Tab); // 創(chuàng)建網(wǎng)格 function createGrids(row,col) {var Tab=document.createElement('table');var Tbody=document.createElement('tbody');var i=0;while(i<row) { var Tr=document.createElement('tr'); var j=0; while(j<col) {var Td=document.createElement('td');Tr.appendChild(Td);j++; } Tbody.appendChild(Tr); i++;}Tab.appendChild(Tbody);return Tab; } </script>

應(yīng)該就可以了