Javascript 增加表格单元格的宽度和高度

我已经使用javascript动态创建了表格，希望在动态创建表格时向表格单元格添加带有图像的“href”链接，并增加表格单元格的宽度和高度。请参见“”。在表格的“Action”列中，我想显示href链接，并想增加表格单元格的宽度和高度。下面是代码。 HTML代码：

<input type="file" name="fileUpload" size="50" id="fileUploadID" multiple/></td>
        </tr><br>
       </table>

     </td></tr>  <tr><td> 
        <br/>&nbsp;&nbsp; <table border="1" id="uploadTable" style="visibility:hidden">

           <tr> <th>SNo</th><th>FileName</th><th>Action</th> </tr>

  </table>

SNoFileNameAction

Javascript代码：

<script>
    var rowN = 1;var count = 1;var a=1;
    document.getElementById("fileUploadID").onchange = function() {
        document.getElementById("uploadTable").style.visibility="visible";

        var fileNameIndex = document.getElementById('fileUploadID').value.lastIndexOf("\\");
        var file_name = document.getElementById('fileUploadID').value.substring(fileNameIndex + 1);

     // Get a reference to the table
      var tableRef = document.getElementById('uploadTable');

      // Insert a row in the table at row index 1
      var newRow   = tableRef.insertRow(rowN);

      // Insert a cell in the row at index 0
      var newCell  = newRow.insertCell(0);

      // Append a text node to the cell
      var newText  = document.createTextNode(rowN);
      newCell.appendChild(newText);

      // Insert a cell in the row at index 1
      var newCell2  = newRow.insertCell(1);

      // Append a text node to the cell
      var newText2  = document.createTextNode(file_name);
      newCell2.appendChild(newText2);

         // Insert a cell in the row at index 2
      var newCell2  = newRow.insertCell(2);

      // Append a text node to the cell
      var newText2  = document.createTextNode('<a href="">delete</a>');
      newCell2.appendChild(newText2);


      rowN++;



    }
</script>

var-rowN=1；var计数=1；var a=1；
document.getElementById（“fileUploadID”）.onchange=function（）{
document.getElementById（“uploadTable”）.style.visibility=“visible”；
var fileNameIndex=document.getElementById（'fileUploadID'）.value.lastIndexOf（“\\”）；
var file_name=document.getElementById（'fileUploadID'）.value.substring（fileNameIndex+1）；
//获取对该表的引用
var tableRef=document.getElementById（'uploadTable'）；
//在表中行索引1处插入一行
var newRow=tableRef.insertRow（rowN）；
//在索引0处的行中插入单元格
var newCell=newRow.insertCell（0）；
//将文本节点附加到单元格
var newText=document.createTextNode（rowN）；
appendChild（newText）；
//在索引1处的行中插入一个单元格
var newCell2=newRow.insertCell（1）；
//将文本节点附加到单元格
var newText2=document.createTextNode（文件名）；
newCell2.appendChild（newText2）；
//在索引2处的行中插入一个单元格
var newCell2=newRow.insertCell（2）；
//将文本节点附加到单元格
var newText2=document.createTextNode（“”）；
newCell2.appendChild（newText2）；
rowN++；
}

您不是在创建html元素，而是在以下代码中创建textNode：

 // Append a text node to the cell
  var newText2  = document.createTextNode('<a href="">delete</a>' +'<a href="">show</a>');
  newCell2.appendChild(newText2);

这只是为了演示的目的，您实际上可以创建剩余的锚并设置它们的所有属性，如上图所示

更新

至于更改大小，只需在css中指定，如下所示：

 // Append a text node to the cell
 var newText2  = document.createElement('a'); //create actual HTML element
 newText2.innerHTML='show'; // set the elements properties
 newText2.href="#";
 newCell2.appendChild(newText2);

td{
 width:250px;
 height:250px;
}

newCell.style.width ='250px';
newCell.style.height ='250px';

更新

可以按如下方式设置动态创建的图元的高度和宽度：

 // Append a text node to the cell
 var newText2  = document.createElement('a'); //create actual HTML element
 newText2.innerHTML='show'; // set the elements properties
 newText2.href="#";
 newCell2.appendChild(newText2);

td{
 width:250px;
 height:250px;
}

newCell.style.width ='250px';
newCell.style.height ='250px';

---

用于显示图像，而不是创建

“并希望增加表格单元格的宽度和高度”。我没有得到那个角色。增加到什么值？@T J-我想将表格单元格的宽度和高度增加到250Px，因为在我的实际应用程序中，表格单元格的宽度太小。@user3692021。最好在下方回复评论，否则其他读者可能会感到困惑：D@Tj-这对我不起作用，因为我的页面中有许多其他表单字段，我想增加我们在JSFIDLE中动态创建的表格单元格的宽度。你能建议如何创建一个具有“活动”列的图像吗。因为我需要在“操作”列中显示图像，当用户单击图像时，它必须执行一些逻辑。谢谢。@user3692021检查更新。。首先，你的问题中没有这个。下次当你问问题时，首先要包括所有细节。。