jquery根据id匹配元素

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()
      ]

我正在尝试仅从 ID 为parent0 和child0 的 块捕获所有数据。

在当前工作状态下，该工具以文本形式捕获两个表中的所有数据。理想情况下，我希望能够单独捕获所有 块，将它们放入一个数组中，然后我可以对其进行迭代。

Answer 1

看起来您正在使用 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 2

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

这样你就会得到所有id为child0的tr
检查此链接以获取更多参考 http://api.jquery.com/category/selectors/

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');;