javascript - Mengapakah membuat jadual dengan berbilang baris dan lajur hanya mempunyai jadual dalam satu baris pada penghujungnya?

Question

Saya menulis sendiri fungsi untuk membuat jadual dengan berbilang baris dan lajur, tetapi selepas menulisnya, saya mendapati bahawa saya hanya boleh mencipta satu baris dan berbilang lajur.

    <p id="game-box"></p>
    <script>
            var Tab=createGrids(16,10);
            var gameBox=document.getElementById("game-box");
            gameBox.appendChild(Tab);
            // 创建网格
            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>

Answer 1

Kerana anda berlari while(i<row) 的结束时候 while(j<col)中的 j 已经是10了哦，所以，第二遍循环 i以后，创建的tr里面都是没有 td 的，因为没有走进while(j<col) buat kali pertama,

Anda boleh menukarnya kepada ini

    <p id="game-box"></p>
    <script>
            var Tab=createGrids(16,10);
            var gameBox=document.getElementById("game-box");
            gameBox.appendChild(Tab);
            // 创建网格
            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>

Sepatutnya baik