javascript - 如何动态生成一个表格，里面装满了按钮？

<分区>

对于我的实习，我需要创建一个填满按钮的表格。 (表中的尺寸可由用户更改)。

我已设法自定义大小(在另一页上)，但我未能为此创建轴和按钮。

<div id="Table"></div>


function addTable() {


            var myTableDiv = document.getElementById("Table");
            var table = document.createElement('TABLE');
            table.border = '1';
            var tableBody = document.createElement('TBODY');
            table.appendChild(tableBody);

            for (var i = 0; i < localStorage.getItem("YWert"); i++) {
                var tr = document.createElement('TR');
                tableBody.appendChild(tr);


                for (var j = 0; j < localStorage.getItem("XWert"); j++) {
                    var td = document.createElement('TD');
                    td.width = '75';
                    td.appendChild(document.createTextNode("Cell " + i + "," + j));
                    tr.appendChild(td);
                }
            }



            myTableDiv.appendChild(table);

我试过重命名 xAxis，但也没有用:


var abc = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
            var x = document.getElementById("Table").rows[0].cells;
            for (var k = 1; k < localStorage.getItem("XWert"); k++) {
                for (var l = 0; l < abc.length; l++) {
                    x[k].innerHTML = abc[l];
                }
            }

例子: Example

最佳答案

function addTable() {
    var abc = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
    var YWert_len = 5;
    var XWert_len = abc.length;
    var myTableDiv = document.getElementById("tbl");
    var table = document.createElement('TABLE');
    table.border = '1';
    var tableBody = document.createElement('TBODY');
    table.appendChild(tableBody);


    for (var i = 0; i <= YWert_len; i++) {
        var tr = document.createElement('TR');
        tableBody.appendChild(tr);


        for (var j = 0; j < XWert_len; j++) {
            var td = document.createElement('TD');
            td.width = '75';
            if(i==0)
            {
                td.appendChild(document.createTextNode(abc[j]));
            }
            else
            {
                var button = document.createElement("button");
                button.innerHTML = "Button"+i+j;
                td.appendChild(button);
            }
            tr.appendChild(td);
        }
    }

    myTableDiv.appendChild(table);
}
```

关于javascript - 如何动态生成一个表格，里面装满了按钮？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56934729/

上一篇：html - 侧边栏的 ARIA 地标角色，其中包含主导航

下一篇：Android Studio 如何使 WebView 支持阿拉伯语，即 RTL 文本方向？

相关文章：

html - 在 head 中指定时，CSS 文件引用不起作用

javascript - 有没有办法检测 Facebook Javascript SDK 是否加载成功？

javascript - 链接/切换类时如何防止 "jumping"？

javascript - 使用javascript将图像插入到html中的其他图像下

javascript - 按两个不同的值对 JavaScript 对象数组进行排序

javascript - 如何将嵌套的 SWF 文件缓存在 DOM 中？

javascript - 使用 jQuery 在高分辨率和低分辨率图像之间切换

javascript - 探索 JS on Object.assign 文本中的勘误表？

javascript - 如何获取 jQuery 选择的 drodpown 列表框的 onclick 事件？

javascript - 如何在 jQuery 中获取窗口选择中的单词数