javascript - 使用jquery将元素附加到子元素

Question

我想动态地将一个 div 元素附加到表中。我使用下面的代码，但它没有正确附加

html

<table id="foo">
  <tr id="row1"><td>FOO</td> </tr>
  <tr id="row2"><td>BAR</td></tr>
  <tr id="row3"><td>APPENDING</td></tr>
  <tr id="row4"><td>ELEMENT</td></tr>
  <tr id="row5"><td>JQUERY</td></tr>
</table>

jQuery

$("input").on("click",function(){
   console.log($("#row3"))
   $("#row3").append("<tr id='foo1'><td>Appending div</td></tr>");
});

小提琴示例

但是代码将元素附加到该行（row3）。我尝试在元素row3之前附加 div我只知道元素的 ID 和.children() 或 .eq()不适用于此目的。谁能帮我。提前致谢

Answer 1

然后使用.before()：

$("input").on("click", function() {
   $("#row3").before("<tr id='foo1'><td>Appending div</td></tr>");
});

演示：http: //jsfiddle.net/zX64K/2/