jquery - 使用 jQuery 切换包装元素的最佳方法

Question

我在 HTML 中有这段代码

<span id="s">Attachments</span>

如何使用 jQuery 将外部 SPAN 元素与以下表格代码块进行切换，以使“附件”文本被表格元素包裹。

<table id="t">
  <tr>
    <td>Attachments</td>
  </tr>
</table>

Answer 1

您可以使用 tr 和 td 创建一个表，将 span 中的 HTML 内容插入到新的 td 元素中，在 span 之后立即插入 table，然后最后删除 span。

$("<table id='t'><tr><td>" + $("#s").html() +
    "</td></tr></table").insertAfter("#s");

$("#s").remove();

我假设“滑动”是指“交换”？所以这就是我删除原始跨度的原因。如果不是这种情况，请不要remove拨打电话。

Answer 2

包装#s元素，然后用它自己的内容替换它：

$("#s")
  .wrap("<table id='t'><tr><td></td></tr></table>")
  .replaceWith(function(){ 
      return this.innerHTML; 
  });

演示：http: //jsbin.com/elotan/edit#source

在下面的评论中进一步讨论之后，OP 似乎希望能够创建一个临时表，并插入#s到它td的任何 . 以下可能会更好：

$("<table>", { 
  id:'t', html:'<tr><td>Foo</td><td>' + $("#s").html() + '</td></tr>'
}).replaceAll("#s");