Question

我循环遍历几个看起来像这样的HTML实例：

<div class="matchup-container">
    <div class="gamequestion">
        <strong>NBA: Who will WIN this matchup?</strong>
    </div>
    <table class="mg-gametableQ">
        <tbody>
            <tr>
                <td class="mg-column1 start">
                    <div class="matchupDate">
                        <span class="startTime">11:00 AM</span>
                    </div>
                </td>
                <td class="mg-column3 opponents  ">
                    <span>
                        <strong>
                            <a>Team</a>: Win
                        </strong>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="mg-column1 start">
                    <div class="matchupDate">
                        <span class="startTime">11:00 AM</span>
                    </div>
                </td>
                <td class="mg-column3 opponents  ">
                    <span>
                        <strong>
                            <a>Team</a>: Win
                        </strong>
                    </span>
                </td>
            </tr>
        </tbody>
    </table>
</div>

要循环使用多个matchup-container div，所以我使用.each()来完成此操作。然后我想循环遍历div中的每个mg-column3，所以我再次使用.each()。最后，我想在<a>（在这种情况下，＆＃34; Team＆＃34;）中提取文本，并将其附加到mg-column3 div中。我的jQuery代码在这里：

$('.matchup-container').each(function() {
    var title = $.trim($(this).find('.gamequestion').text());

    $(this).find('.mg-column3').each(function () {
        if (isStraightUp(title))
        {
            var teams = getStraightUpTeams(this);
            $(this).append('<span class=odds-favorite>' + teams[0] + '</span>');
        }
    });
});

function isStraightUp (title)
{
    return true;
}

function getStraightUpTeams(matchup)
{
    var teams = [];

    teams[0] = $(matchup).find("a")[0].text();
    teams[1] = $(matchup).find("a")[1].text();

    return teams;
}

但没有任何反应。 Chrome开发工具告诉我，我无法在未定义的元素上调用.text()，因此一切都崩溃了。但我无法弄清楚为什么jQuery没有抓住我想要的<a>标签内的文本。这是JSFiddle.任何人都可以帮忙吗？

Answer 1

由于$(matchup)返回一个jQuery对象，您需要使用jQuery方法，例如 .eq() 或 :eq() 选择器：< / p>

teams[0] = $(matchup).find("a").eq(0).text();
teams[1] = $(matchup).find("a").eq(1).text();

<强> Updated Fiddle

或：

teams[0] = $(matchup).find("a:eq(0)").text();
teams[1] = $(matchup).find("a:eq(1)").text();

<强> Updated Fiddle

Answer 2

在Jquery中使用.eq（）。

function getStraightUpTeams(matchup)
{
    var teams = [];

    teams[0] = $(matchup).find("a").eq(0).text();
    teams[1] = $(matchup).find("a").eq(1).text();

    return teams;
}

Answer 3

getStraightUpTeams出现错误。查看您的控制台以查看错误

未捕获的TypeError：对象[对象的属性'text' HTMLAnchorElement]不是函数

您正在尝试在没有这种方法的dom元素引用中调用方法text，您需要使用jQuery包装器来调用方法.text()

function getStraightUpTeams(matchup) {
    var teams = [],
        $as = $(matchup).find("a");

    teams[0] = $as.eq(0).text();
    teams[1] = $as.eq(1).text();

    return teams;
}

演示：Fiddle

jQuery似乎没有找到嵌套类

3 个答案: