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>");
});

Fiddle example

但是代码将元素附加到该行(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/