Question

我怎样才能编写遍历表的javascript，抓取类，然后替换为图像？例如，我有一个表格，其中包含附加了数字类的列：

<td class="images 12-345"></td>
<td class="images 98-763"></td>

这些数字与我希望在查询的其余部分完成处理后使用javascript加载的图像名称相关联。所以最终产品看起来像：

<td class="images 12-345"><img src="http://site.com/12-345.jpg"></td>
<td class="images 98-763"><img src="http://site.com/98-763.jpg"></td>

但是直到一切都完成加载。我希望在那里有一个占位符图形，在处理完所有内容后用正确的图像文件替换。

如何迭代这些行，然后将适当的图像加载到每个单元格？我首先想到的是我可以使用.images选择器来检索每个唯一的数字类名称并将其传递给变量。然后使用该变量，我可以将其附加到图像路径的其余部分，并将其放回到相应的表格单元格中。我不希望这个开始处理，直到dom的其余部分完成加载并且原始的sql查询已经完成。我能否就什么是写这篇文章的最佳方式提出一些建议。 jQuery是我的选择。

Answer 1

你可以用jQuery做这样的事情：

$('td.images').each(function() {
    var $td     = $(this);
    var classes = $(this).attr('class').split(/\s+/);
    var num     = $.grep(classes, function(c) { return c.match(/^[\d-]+$/) });
    if(num.length)
        $td.append('<img src="http://site.com/' + num[0] + '.jpg">');
});

演示（仅包含单元格中的数字）：http://jsfiddle.net/ambiguous/vrDvc/1/

您可能需要调整$.grep以及如何处理num数组以匹配您的实际数据，但基本技术应该有效。

使用类名加载相应的图像路径

1 个答案: