Question

我当然赞成DIV，但我正在开发一个使用嵌套表的项目。我需要移动已经存在的一些字段，并创建新的字段，我将其描述为网格（想想.NET中的gridview）。

将列添加到嵌套HTML表格中最简单的方法是什么？或者，我是否应该研究使用无表格设计重新设计整个页面的想法，除了我在gridview中需要的字段？

Gridview是这样的：

专栏：数量，Amt，注释
行：材料，人工，杂项

Answer 1

您必须添加＆lt; TD＆gt;细胞到每一行。

既然你说你还需要移动东西，你应该考虑将输出结构重写为DIV格式或重写表格结构。我个人更喜欢数据网格的表结构。

Answer 2

jQuery有很多DOM遍历函数可供选择。

让我们说，例如，你从

开始

<html>
<body>
   <table id="aTable"></table>
</body>
</html>

然后您可以使用jQuery添加到表中：

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" />
<script type="text/javascript">
   $(document).ready(function(){
      $("#aTable > tbody").append('<tr id="row1"><td>some data</td></tr>');
   });
</script>
</head>
<body>
   <table id="aTable"></table>
</body>
</html>

这会在表格中添加一个单元格。注意tbody标记，我发现这是必需的，因为tbody是由浏览器呈现时的隐式标记。

现在让我们倒退吧。如果您从表格中已有的单元格开始，可以使用remove（）函数轻松删除它：

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" />
<script type="text/javascript">
   $(document).ready(function(){
      $("#row1").remove();
   });
</script>
</head>
<body>
   <table id="aTable">
      <tr id="row1">
         <td>some data</td>
      </tr>
   </table>
</body>
</html>

噗，它消失了。这样做的好处在于，你可以使用事件处理程序和各种很酷的东西以交互方式完成所有这些工作。我甚至无法抓住jQuery的表面，因为我对它也很新，但文档非常好。 Check it out

编辑：这也假设您知道要添加的内容。如果你需要动态地做，那么一点点AJAX将会有很长的路要走（jQuery将其抽象化以使其变得更好）。

Answer 3

首先，我不知道Gridview的样子......但...... 如果我正确理解了问题，您可以尝试在其中添加<td> <table>，然后将该表用作列。当您完成列添加</table></td>时，事情应该与以前相同。

这种方法可能会变得非常混乱，但我不能100％确定这是你想要实现的目标。

如何将列添加到嵌套的HTML表

3 个答案: