猿问

使用Javascript创建表

使用Javascript创建表

我有一个JavaScript函数,它创建一个包含3行2个单元格的表。

谁能告诉我如何使用我的功能创建下表(我需要根据我的情况这样做)?

这是我的javascript和html代码,如下所示:

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

  // create elements <table> and a <tbody>
  var tbl = document.createElement("table");
  var tblBody = document.createElement("tbody");

  // cells creation
  for (var j = 0; j <= 2; j++) {
    // table row creation
    var row = document.createElement("tr");

    for (var i = 0; i < 2; i++) {
      // create element <td> and text node 
      //Make text node the contents of <td> element
      // put <td> at end of the table row
      var cell = document.createElement("td");
      var cellText = document.createTextNode("cell is row " + j + ", column " + i);

      cell.appendChild(cellText);
      row.appendChild(cell);
    }

    //row added to end of table body
    tblBody.appendChild(row);
  }

  // append the <tbody> inside the <table>
  tbl.appendChild(tblBody);
  // put <table> in the <body>
  body.appendChild(tbl);
  // tbl border attribute to 
  tbl.setAttribute("border", "2");}
<table width="100%" border="1">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td rowspan="2">&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
  </tr></table>


森栏
浏览 434回答 3
3回答

炎炎设计

function&nbsp;addTable()&nbsp;{ &nbsp;&nbsp;var&nbsp;myTableDiv&nbsp;=&nbsp;document.getElementById("myDynamicTable"); &nbsp;&nbsp;var&nbsp;table&nbsp;=&nbsp;document.createElement('TABLE'); &nbsp;&nbsp;table.border&nbsp;=&nbsp;'1'; &nbsp;&nbsp;var&nbsp;tableBody&nbsp;=&nbsp;document.createElement('TBODY'); &nbsp;&nbsp;table.appendChild(tableBody); &nbsp;&nbsp;for&nbsp;(var&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;<&nbsp;3;&nbsp;i++)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;tr&nbsp;=&nbsp;document.createElement('TR'); &nbsp;&nbsp;&nbsp;&nbsp;tableBody.appendChild(tr); &nbsp;&nbsp;&nbsp;&nbsp;for&nbsp;(var&nbsp;j&nbsp;=&nbsp;0;&nbsp;j&nbsp;<&nbsp;4;&nbsp;j++)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;td&nbsp;=&nbsp;document.createElement('TD'); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;td.width&nbsp;=&nbsp;'75'; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;td.appendChild(document.createTextNode("Cell&nbsp;"&nbsp;+&nbsp;i&nbsp;+&nbsp;","&nbsp;+&nbsp;j)); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tr.appendChild(td); &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;} &nbsp;&nbsp;myTableDiv.appendChild(table);}addTable();<div&nbsp;id="myDynamicTable"></div>
随时随地看视频慕课网APP
我要回答