2

我没有找到这个特定问题的答案。

我有一个动态生成的表。它是一个包含名称、国家、排名和分数的分数表。我想用图像替换纯文本。

<table>
  <tr>
    <td>1.</td>
    <td>Lindsey Vonn (usa)</td>
    <td>440</td>
  </tr>
  <tr>
    <td>2.</td>
    <td>Lara Gut (sui)</td>
    <td>400</td>
  </tr>
  <tr>
    <td>3.</td>
    <td>Nicole Hosp (at)</td>
    <td>380</td>
  </tr>
</table>

目标是用美国国旗(图片)替换(美国)。(sui) 等也是如此...我没有表、td 或 tr 的 ID 或类。

4

5 回答 5

1

使用regex诸如\(([a-z]*)\)并使用返回的值来显示具有该名称的文件img src

$("table tr td:nth-child(2)").each(function(index, item) {
    $(item).html(function(index, text) {
        return text.replace(/\(([a-z]*)\)/, "<img src=\"$1.jpg\" />");
    });
});

小提琴在这里

于 2012-12-10T13:07:50.110 回答
0

在 JavaScript 中

var xx=document.getElementsByTagName('table')[0];
for (var i=0;i<xx.getElementsByTagName('tr').length;i++)
document.write(xx.getElementsByTagName('tr')[i].getElementsByTagName('td')[0].innerHTML="<img src='anything.jpg' />");
于 2012-12-10T13:14:25.983 回答
0
(function($) {
  var icons = {
    usa: '/path/to/usa.png',
    sui: '/path/to/sui.png',
    at:  '/path/to/at.png'    
  };

  // on DOM ready
  $(function() {
    // you need a way of selecting
    // that table and this selector
    // is dangerously generic
    var table = $('table'),
        markup = table.html(),
        image;

    $.each(icons, function(icon, path) {
      image = '<img src="' + path + '" alt="' + icon + '">';
      markup = markup.replace('(' + icon + ')', image); 
    });

    table.html(markup);
  });
}(jQuery));
于 2012-12-10T13:05:00.367 回答
0
$.each($("table tr td:first"),function(){
if($(this).html().indexOf("usa"))
{
$(this).html($(this).html().replace("<img src=''></img>)
}
...

});
于 2012-12-10T13:05:28.927 回答
0

嘿,伙计,这是一个简单的解决方案,也是有史以来最好的解决方案,但是您必须像使用人名一样更改标志图像名称,例如(美国)您将需要使用 usa.jpg 更改标志图像名称,同样,对于(sui ) 您需要使用 sui.jpg 更改标志图像名称:

链接到 JSFIDDLE

$("table tr td:nth-child(2)").each( function() { // this line is edited!
    var g = $(this).text();
    if(g!="") {
    var n = g.split("(");
        var t= n[0];
        var m = n[1];
        var s = m.replace(")", "");
        var img_code = "<img src='.html/"+s+".jpg'>"; // here you can change path. I have edited it for .html directory!
        $(this).html(t+img_code);
    }
});

注意:这些图像不会在 jsfiddle 中显示,因为它们没有 usa.jpg 或 sui.jpg 的图像!

于 2012-12-10T13:49:38.240 回答