Синтаксис Jquery для добавления строк между строками таблицы HTML

Question

Что такое синтаксис jQuery для добавления строк между существующими строками таблицы HTML?

<Table id="TEST"> <tr>1</tr> <tr>2</tr> </table> 

Я хочу добавить

<tr>xx</tr> 

от 1 до 2

Например:

<tr>1</tr>   **<tr>xx</tr>** <tr>2</tr>

и обратите внимание, здесь нет идентификатора для строк.

Исправление окончательного вида

до

<table id=Test><tr> <td>1 </td> </tr><tr> <td>2 </td> </tr></table>

после

 <table id=Test><tr> <td>1 </td> </tr>  <tr> <td>xx </td> </tr> <tr> <td>2 </td></tr></table>

Answer 1

Примерно так:

$('#TEST > tbody > tr').eq(0).after('<tr>xx</tr>');

Answer 2

Ответ на ваш вопрос (буквально):

$("table#test tr:contains('1'").after('<tr>xx</tr>');

Это означает: добавьте «xx» после <tr>, который содержит «1» в таблице с идентификатором «test».

Полагаю, это не совсем то, что вам нужно, можете ли вы сказать нам, что именно вы хотите сделать?

Существуют различные способы добавления контента к элементам. Я предлагаю взглянуть на JQuery Doc, особенно на DOM, около 1010 *, DOM, внутри и DOM, снаружи .

Answer 3

$('#test tr').first().append('<tr>xx</tr>');

Вы можете заменить first() на eq(n) (в котором n - это число от 0 до n-1 строк таблицы) и добавить строку после любой существующей строки.

Answer 4

Предполагая, что вы ищете способ вставить новую строку после первой существующей строки (и вы не ищете способ вставить ее в место, описываемое содержимым существующих строк), вы можете использовать after для вставки содержимого и eq для уменьшения набора совпадающих элементов до необходимого индекса:

$("#TEST tr").eq(0).after("<tr><td>x</td></tr>");

Обратите внимание, что ядобавлен в элемент td, поскольку недопустимо иметь текстовые узлы в качестве потомков элементов tr.

Также стоит отметить большое разнообразие способов выбора «первого» элемента с помощью jQuery.В 5 ответах на этот вопрос мы видим 3 разных метода, и их даже больше.Использование .eq(0) является наиболее эффективным .

Answer 5

специально для согласованности между браузерами вы должны обернуть все свои tr в элемент tbody. затем вы можете after()/insertAfter() новую строку (после первой) или before()/insertBefore() строку (до последней).

http://api.jquery.com/after/
http://api.jquery.com/before/
http://api.jquery.com/insertAfter/
http://api.jquery.com/insertBefore/

пример
insertAfter: $('<tr>xx</tr>').insertAfter($('tr:first'));
после: $('tr:first').after('<tr>xx</tr>');

Answer 6

$('#TEST tr:gt(0)').after('<tr>xx</tr>');

gt означает больше, чем. Обратите внимание, что индекс строк начинается с 0, а не 1.