用html实现表格拖动

要实现表格的拖动，可以使用HTML5中提供的拖放API。具体实现步骤如下：

1. 设置表格的draggable属性为true，使得表格能够被拖动。
2. 监听表格的dragstart事件，在该事件中设置拖动的数据。一般可以设置数据为表格的id。
3. 监听目标区域（一般是页面中的某个容器）的dragover事件，阻止默认行为。
4. 监听目标容器的drop事件，在该事件中获取拖动的数据，根据数据找到要移动的表格，将其移动到目标位置。

下面是一个简单的示例代码：

HTML代码：

<table id="table1" draggable="true">
  <tr>
    <td>Content 1</td>
    <td>Content 2</td>
  </tr>
  <tr>
    <td>Content 3</td>
    <td>Content 4</td>
  </tr>
</table>

<div id="dropzone"></div>

JavaScript代码：

var dragged;

// 监听drag开始事件，在其中设置数据
document.getElementById("table1").addEventListener("dragstart", function(event) {
  dragged = event.target;
  event.dataTransfer.setData("text", event.target.id);
});

// 监听目标容器的dragover事件，阻止默认行为
document.getElementById("dropzone").addEventListener("dragover", function(event) {
  event.preventDefault();
});

// 监听目标容器的drop事件
document.getElementById("dropzone").addEventListener("drop", function(event) {
  event.preventDefault();
  var data = event.dataTransfer.getData("text");
  var dropped = document.getElementById(data);
  this.appendChild(dragged);
});

以上是一个比较简单的实现方式，实际开发中还需要考虑拖动时的一些交互效果，比如拖动过程中显示鼠标指针的样式、拖动时显示半透明效果等。