Question

我正在阅读带有JS的页面，如下所示：

<div class="games-fullcol">
  <div class="paginationNav">
    <div class="tableHead" style="background: #1d7225;text-align: center;">PROJECTED 2014     SEASON STATS</div>
      <table class="tableBody" width="100%" cellspacing="1" cellpadding="2" border="0" bgcolor="#ffffff">
        <tbody>
          <tr class="tableSubHead" bgcolor="#6dbb75" align="right">
          <tr class="tableBody" bgcolor="#f2f2e8" align="right">
          <tr class="tableBody" bgcolor="#f8f8f2" align="right">
            <td align="left">2014 Projections</td>
            <td class="sectionLeadingSpacer"></td>
            <td class="playertableStat ">16/17</td>
            <td class="playertableStat ">12/14</td>
            <td class="playertableStat ">5/7</td>
            <td class="playertableStat ">33/38</td>
            <td class="playertableStat ">55/55</td>
            <td class="sectionLeadingSpacer"></td>
            <td class="playertableStat appliedPoints">171</td>
          </tr>
          <tr>
        </tbody>
      </table>
      <table class="tableBody" width="100%" cellspacing="1" cellpadding="2" border="0" bgcolor="#ffffff">
        ...

基本上，table.tableBody元素旁边有一堆div.games-fullcol个元素。在每个中，我想解析tr.tableBody中的文本。这就是我目前的尝试：

var $ = window.$;
var table = $("div.games-fullcol");
table.find("table.tableBody").each(function (i, el) {
    var $trs = $(this).find('tr.tableBody').filter(function() {
        return $(this).css('background-color') == '#f8f8f2';
    });
    console.log($trs.eq(0).text());
});

现在，console.log打印出一堆空白行（不知道为什么）。我希望它输出'2014 Projections'。我在DOM中如何寻找它一定存在问题，但我无法弄清楚它是什么。任何人都能找到我的逻辑问题吗？

Answer 1

如果您正在转发属性：

bgcolor="#f8f8f2"

您应该将过滤器更改为：

return $(this).attr('bgcolor') == "#f8f8f2"

目前您的过滤器正在检查css样式背景颜色而不是HMTL属性bgcolor。

话虽如此，让您的代码依赖于布局样式是一个非常糟糕的主意，为什么不使用类并使用它们进行过滤？

使用JQuery选择正确的元素

1 个答案: