Элемент соответствия jquery на основе идентификатора

Question

Я новичок в JQuery. Застрял и был бы признателен за помощь. В настоящее время создается инструмент для сбора данных с определенной страницы. Страница выглядит так:

<table width="100%" border="0" align="center" cellpadding="3" cellspacing="1">
 <tbody>  //This is data group 1    
  <tr id="parent0">   //Record 1
    <td align="left"> <---------- text1 here -------> </td>
    <td align="left"> <---------- text2 here -------> </td>
    <td align="left"> <---------- text3 here -------> </td>
  </tr>    
  <tr id="parent0">   //Record 2
    <td align="left"> <---------- text1 here -------> </td>
    <td align="left"> <---------- text2 here -------> </td>
    <td align="left"> <---------- text3 here -------> </td>
  </tr>    
 </tbody>
</table>

<table width="100%" border="0" align="center" cellpadding="3" cellspacing="1">
 <tbody>  //This is data group 2    
  <tr id="child0">   //Record 1
    <td align="left"> <---------- text1 here -------> </td>
    <td align="left"> <---------- text2 here -------> </td>
    <td align="left"> <---------- text3 here -------> </td>
  </tr>    
  <tr id="child0">   //Record 2
    <td align="left"> <---------- text1 here -------> </td>
    <td align="left"> <---------- text2 here -------> </td>
    <td align="left"> <---------- text3 here -------> </td>
  </tr>    
 </tbody>
</table>

Ниже приведен фрагмент jquery:

ancestor = $(this).closest("tr[id]");

  matchedElement = $(this).first();
  originalBgColor = $(matchedElement).css('background-color');
  $(matchedElement).css('background-color', 'green');
  $(matchedElement).bind('click.annotator', function(event) {
    event.stopPropagation();
    event.preventDefault();
    self.port.emit('show',
      [
        document.location.toString(),
        $(ancestor).attr("child0"),
        $(matchedElement).text()
      ]

Я пытаюсь захватить все данные только <tr> блоки с идентификатором parent0 и child0.

В своем текущем рабочем состоянии инструмент собирает все данные в двух таблицах в виде текста. В идеале я хотел бы иметь возможность захватить все <TR> блоки отдельно, поместите их в массив, который я могу затем перебрать.

Answer 1

$('tr[id="child0"]').each(function() {
                         //this will be fired for each matched element
                         $(this).doSomething();
                      }
                     );

таким образом, вы получите все tr, чей идентификатор child0, проверьте эту ссылку для получения дополнительной ссылки http://api.jquery.com/category/selectors/

Answer 2

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

Вместо

<tr id="child0">
<tr id="parent0">

Сделай это

<tr class="child0">
<tr class="parent0">

В отличие от ID, вы можете присвоить одно и то же значение нескольким элементам с помощью атрибута class.

Затем вы можете выбрать их все, как это

$("tr.child0,tr.parent0").each(
                          function() {
                             //this will be fired for each matched element
                             $(this).doSomething();
                          }
                         )

Answer 3

Делай как это...

$('cite.fn:contains(blabla)').css('color', 'red');

Изменить: хотя это будет соответствовать "blablablabla", а также.

$('cite.fn').each(function () {
    if ($(this).text() == 'blabla') {
        $(this).css('color', 'red');
    }
});

Это должно быть более точным.

Изменить: На самом деле, я думаю, что это решение более элегантно:

$('cite.fn').filter(function () {
    return $(this).text() == 'blabla';
}).css('color', 'red');;