jQuery bucle a través del objeto y busque el título, pero omita otros

StackOverflow https://stackoverflow.com/questions/5821963

  •  26-10-2019
  •  | 
  •  

Pregunta

Me he estado enseñando js y jQuery y todavía lucho con cómo usar $ de manera efectiva para recorrer un objeto y extraer la información que quiero.

Tengo una mesa que tiene un ícono de la bandera y un título que describe que quiero poner al final de la fila. Sin embargo, a veces hay otros íconos que debo ignorar. Así que busco "bandera" en URL y si existe, establecí InnerHtml de 2nd para durar la celda hasta el 'título'.

Como puede ver a continuación, he tenido que crear una variedad de disminución para evitar omitir a la siguiente fila con "Título" si encuentro un icono sin bandera.

Quiero que esta fila se agregue con "título", que es la ubicación:

<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>

Para verse así:

<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>

Entonces mi pregunta: ¿cuál es la mejor manera de hacer todo este procedimiento? Aquí hay un enlace al JSFiddle - http://jsfiddle.net/ukjxh/78/ - A las 3:47 puedes ver un ícono de la bandera.

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;
}

}

¿Fue útil?

Solución

Lo siento, pero no estoy seguro de entender tu pregunta demasiado bien. Sin embargo, el siguiente selector le dará todas las banderas de la mesa 

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

Esto debería darle la oportunidad de atravesar el DOM y llegar a lo que necesita

Demo en vivo : http://jsfiddle.net/jomanlk/ukjxh/87/

Otros consejos

Puedes intentar usar cada

Por ejemplo:

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

También puede usar una clase CSS para seleccionar solo las etiquetas IMG que le interesan:

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

Html entonces sería

<img title="Arvada, CO, USA" class="flagImg" src="http://static.getclicky.com/media/flags/us.gif">
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top