点击按钮多个tr里面td相互移动

如果您希望实现点击按钮可以移动多个tr中的td元素，可以根据以下步骤进行操作：

1. 首先，在HTML中为每个tr元素添加一个唯一的id属性，以便可以在JavaScript中使用它们。例如：

<table>
  <tr id="row1">
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  <tr id="row2">
    <td>4</td>
    <td>5</td>
    <td>6</td>
  </tr>
  <tr id="row3">
    <td>7</td>
    <td>8</td>
    <td>9</td>
  </tr>
</table>

2. 然后，在JavaScript中为上下移动按钮分别绑定点击事件。在事件处理程序中，您需要获取当前选中的td元素，并检查它是否可以移动到目标位置。如果可以移动，您需要获取目标位置上的td元素，并将当前选中的td元素插入到目标位置。以下是一个简单的示例代码：

<table>
  <tr id="row1">
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  <tr id="row2">
    <td>4</td>
    <td>5</td>
    <td>6</td>
  </tr>
  <tr id="row3">
    <td>7</td>
    <td>8</td>
    <td>9</td>
  </tr>
</table>

<button id="btnUp">上移</button>
<button id="btnDown">下移</button>

<script>
  $(function() {
    // 上移按钮点击事件
    $("#btnUp").click(function() {
      var $selectedTd = $("td.selected");
      var $prevTd = $selectedTd.prev();
      if ($prevTd.length > 0) {
        // 获取当前选中的td元素所在的tr元素
        var $selectedTr = $selectedTd.closest("tr");
        // 获取目标位置上的td元素
        var $targetTd = $prevTd;
        while ($targetTd.length === 0 && $selectedTr.prev().length > 0) {
          $selectedTr = $selectedTr.prev();
          $targetTd = $selectedTr.find("td:last");
        }
        // 将当前选中的td元素插入到目标位置上
        $selectedTd.insertBefore($targetTd);
      }
    });
    
    // 下移按钮点击事件
    $("#btnDown").click(function() {
      var $selectedTd = $("td.selected");
      var $nextTd = $selectedTd.next();
      if ($nextTd.length > 0) {
        // 获取当前选中的td元素所在的tr元素
        var $selectedTr = $selectedTd.closest("tr");
        // 获取目标位置上的td元素
        var $targetTd = $nextTd;
        while ($targetTd.length === 0 && $selectedTr.next().length > 0) {
          $selectedTr = $selectedTr.next();
          $targetTd = $selectedTr.find("td:first");
        }
        // 将当前选中的td元素插入到目标位置上
        $selectedTd.insertAfter($targetTd);
      }
    });
    
    // td元素点击事件
    $("td").click(function() {
      // 取消之前选中的元素的选中状态
      $("td.selected").removeClass("selected");
      // 设置当前选中的元素的选中状态
      $(this).addClass("selected");
    });
  });
</script>

在上面的代码中，我们首先为每个td元素绑定了点击事件，在点击时将当前选中的元素设置为选中状态。然后，我们为上移和下移按钮分别绑定了点击事件，在点击时获取当前选中的元素所在的tr元素，以及上一个或下一个元素所在的td元素，并使用insertBefore()和insertAfter()方法来实现元素的移动。注意，在获取目标位置上的td元素时，我们使用了while循环来检查目标位置是否存在，如果不存在则继续检查下一个tr元素。