时间戳

首页 > 解决方案 > 带按钮的 JS 表格生成器

javascript - 带按钮的 JS 表格生成器

问题描述

我在网站上找到了这个答案，并将其用作我自己代码的基础。

我试图让按钮在表格中呈现，但它只是作为文本出现，而不是像我想要的那样呈现为页面上的元素。

这是这里使用的代码：

function tableCreate() {
  var body = document.getElementsByTagName("body")[0];

  var tbl = document.createElement("table");
  var tblBody = document.createElement("tbody");

  for (var j = 0; j <= 10; j++) {
    var row = document.createElement("tr");

    for (var i = 0; i <10; i++) {
      var cell = document.createElement("td");
      var btn = "<button>" + j +"-"+i+"</button>"
      var cellText = document.createTextNode(btn);

      cell.appendChild(cellText);
      row.appendChild(cell);
    }
    tblBody.appendChild(row);
  }
  tbl.appendChild(tblBody);
  body.appendChild(tbl);
  tbl.setAttribute("border", "2");
}

function cell_id(x,y){
  msg('x:'+x+ ' y:'+y)
}

标签： javascripthtmlbutton

解决方案

createTextNode()顾名思义，创建一个文本节点。如果您在其中有标记，它将按字面意思显示。

您应该已经创建了一个button节点，并将其文本设置为变量，如下例所示。

    for (var i = 0; i <10; i++) {
      var cell = document.createElement("td");
      var btn = document.createElement("button");
      btn.innerText = j + "-" + i;
      cell.appendChild(btn);
      row.appendChild(cell);
    }

推荐阅读