jQuery循环遍历对象并查找标题但跳过其他人

时间:2011-04-28 16:33:38

标签: jquery loops html-table skip

我一直在教自己JS和Jquery,我仍然在努力如何有效地使用$循环一个对象并提取我想要的信息。

我有一个表格,其中有一个标志图标和一个描述我想要放在行尾的标题。但是,有时候我必须忽略其他图标。所以我在url中查找“flag”,如果它存在,我将2nd的innerHTML设置为最后一个单元格为'title'。

如下所示,如果我遇到非标志图标,我必须创建一个减量VAR y以防止跳过下一行“title”。

我希望此行附加“title”,即位置:

<td>11:44pm</td><td><a href="/stats/visitors?site_id=66351439&amp;date=2011-04-27&amp;country=the+united+states"></a></td><td> <a class="custom" title="Comcast Cable" href="/stats/visitors?site_id=66351439&amp;date=2011-04-27&amp;ip_address=75.70.103.23">Comcast Cable</a></td><td><a href="/stats/visitors-actions?site_id=66351439&amp;date=2011-04-27&amp;session_id=228613269">1 action</a></td><td>10s</td><td width="100%"> &nbsp; </td><td></td>

看起来像这样:

<td>11:44pm</td><td><a href="/stats/visitors?site_id=66351439&amp;date=2011-04-27&amp;country=the+united+states"></a></td><td> <a class="custom" title="Comcast Cable" href="/stats/visitors?site_id=66351439&amp;date=2011-04-27&amp;ip_address=75.70.103.23">Comcast Cable</a></td><td><a href="/stats/visitors-actions?site_id=66351439&amp;date=2011-04-27&amp;session_id=228613269">1 action</a></td><td>10s</td><td width="100%">Aurora, CO, USA</td><td></td>

所以我的问题 - 什么是更好的方法来完成整个过程。这是jsfiddle的链接 - http://jsfiddle.net/ukJxH/78/ - 在3:47你可以看到一个非旗帜图标。

var x = $('.tableborder tr img');
y = 1;
for (i = 0; i < x.length; i++) {
    var flagg = x[i].src;
    var pattn = /flag/gi;
    var loca = x[i].title;

    if (flagg.match(pattn) == "flag") {
        //$('td:nth-child(6)')[i + 14 + y].innerHTML = loca;
        $('#main :nth-child(i) td:nth-child(6)')[i].innerHTML = loc } else {
    y = y - 1;
}

}

3 个答案:

答案 0 :(得分:0)

您可以尝试使用each

例如:

$(".tableborder tr img").each(function() {
   var src = $(this).attr("src");
   var alt = $(this).attr("alt");
});

答案 1 :(得分:0)

您还可以使用css类仅选择您感兴趣的img标签:

$(".tableborder tr img.flagImg").each(function() {
   ...
});

HTML将是

<img title="Arvada, CO, USA" class="flagImg" src="http://static.getclicky.com/media/flags/us.gif">

答案 2 :(得分:0)

我很抱歉,但我不确定我是否理解你的问题。但是,以下选择器将为您提供表中的所有标志

$('.tableborder tr img[src*="flag"]').each(function(){
   $(this)
    .closest('td')
    .nextAll('td:last')
    .html('Title from image : ' + $(this).attr('title'));
});

这应该让你有机会遍历DOM并获得你需要的东西

现场演示:http://jsfiddle.net/jomanlk/ukJxH/87/