Javascript 通过输入将列和行添加到tale-JS_Javascript

Javascript 通过输入将列和行添加到tale-JS

javascript

Javascript 通过输入将列和行添加到tale-JS,javascript,Javascript,默认情况下，表格为3x3（3行3列）。如果用户在输入7中写入，则需要将表更改为7x7表我在代码中所做的是首先添加行（工作成功），然后向每一行添加单元格/列，但由于某些原因，这不起作用谢谢你的帮助相关代码： <main> <table> <tr> <td></td> <td></td>

默认情况下，表格为3x3（3行3列）。如果用户在输入7中写入，则需要将表更改为7x7表

我在代码中所做的是首先添加行（工作成功），然后向每一行添加单元格/列，但由于某些原因，这不起作用

谢谢你的帮助

相关代码：


    <main>
        <table>
            <tr>
                <td></td>
                <td></td>
                <td></td>
            </tr>

            <tr>
                <td></td>
                <td></td>
                <td></td>
            </tr>

            <tr>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </table>
    </main>

<input id="tableSizeInput" type="text" placeholder="enter number">
            <button id="tableSizeButton">Set</button>

tableSizeButton.onclick=函数（）{
设计数器=0；
while（计数器！=parseInt（tableSizeInput.value））
{
let row=table.insertRow（0）；
设cell1=row.insertCell（0）；
设cell2=row.insertCell（1）；
设cell3=row.insertCell（2）；
计数器++；
}
对于（b=0；b我在这里寻找

我发现有两件东西不见了：
一,/
这将使您能够使用此方法添加额外的行，我的意思是插入行，然后为该行插入单元格，
我认为你不能为已经存在的行插入单元格。
因此，你不能通过insertRow/Cell方法将3x3表设置为7x7，但你可以将3x3表设置为3x7甚至7x7，但在这种情况下，前3行将没有单元格。
如果你运行此代码，请确保添加带有td、tr边框的css

    <body>


            <table id="tt">
                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>

                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>

                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
            </table>

    <script>

     function a()
    {

    var v=document.getElementById('i1').value;
    parseInt(v);

    var table=document.getElementById('tt');

    for (var i = 0; i < v-3; i++) {
      var row = table.insertRow(0);

    for (var l = 0; l < v; l++) {
          var cell = row.insertCell(l);
    }

    }

    }
    </script>
            <input id="i1" type="text">
            <input id="b1" onclick="a();" type="button">
    </body> 



函数a（）
{
var v=document.getElementById（'i1'）。值；
parseInt（v）；
var table=document.getElementById（'tt'）；
对于（变量i=0；i
计数器需要从3
开始，否则将有3行太多。i
oth需要从0开始，否则将有3列太少。
tableSizeButton.onclick = function () {
                let counter = 0;
                while(counter!=parseInt(tableSizeInput.value))
                {
                    let row = table.insertRow(0);
                    let cell1 = row.insertCell(0);
                    let cell2 = row.insertCell(1);
                    let cell3 = row.insertCell(2);

                    counter++;
                }

                for (let b = 0; b<table.rows.length; b++)
                {
                    for(let i = 3; i<parseInt(tableSizeInput.value)-3; i++)
                       {
                           table.rows[b].insertCell(i);
                       }
                }

<main>
    <table id="myTable">
        <tr>

 let counter = 0;
 var table = document.getElementById("myTable");
 while (counter != parseInt(tableSizeInput.value)) {


    <body>


            <table id="tt">
                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>

                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>

                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
            </table>

    <script>

     function a()
    {

    var v=document.getElementById('i1').value;
    parseInt(v);

    var table=document.getElementById('tt');

    for (var i = 0; i < v-3; i++) {
      var row = table.insertRow(0);

    for (var l = 0; l < v; l++) {
          var cell = row.insertCell(l);
    }

    }

    }
    </script>
            <input id="i1" type="text">
            <input id="b1" onclick="a();" type="button">
    </body>