Question

如何将新tr附加到表格顶部而不是其他tr。

示例：

<table width='100%'>
<tr><td>something</td><td>else here</td></tr>
<tr><td>something2</td><td>else here2</td></tr>
</table>

在jQuery中点击事件之后，我该如何放置 <tr><td>something3</td><td>else here3</td></tr> 在表的顶部，所以它现在看起来像

<table width='100%'>
<tr><td>something3</td><td>else here3</td></tr>
<tr><td>something</td><td>else here</td></tr>
<tr><td>something2</td><td>else here2</td></tr>
</table>

对此的任何帮助将不胜感激。

Answer 1

$('table').prepend('<tr><td>something3</td><td>else here3</td></tr>');

...或

$('<tr><td>something3</td><td>else here3</td></tr>').prependTo('table');

有关'prepend'的更多信息： http://docs.jquery.com/Manipulation/prepend

有关'prependTo'的更多信息： http://docs.jquery.com/Manipulation/prependTo

Answer 2

此JS目前是IE特定的，但它不应该太难以使其与多浏览器兼容。

<html>
<body>
<script language="JavaScript">
function function1() {
   var myRow = document.all.myTable.insertRow(0);
   var myCell = myRow.insertCell();
   myCell.innerText = "The added cell"; 
} 
</script>
<table id="myTable" border="1" cellspacing="5" cellpadding="5">
   <tr>
       <td width="100">3</td>
       <td width="100">4</td>
   </tr>
   <tr>
       <td>1</td>
       <td>2</td>
   </tr>
</table>
<button onclick="function1();">Add a cell</button>
</body>
</html>

如何将tr附加到表的顶部

2 个答案: