Question

我正在寻找用图片替换表格中的文字。我将有三种文本变体：强，中，弱。这是为了优先考虑咖啡产品的强度。如果文字说得很强，那么我想用'strong.png'等替换。我已经有了这么远，但现在坚持想法。以下不起作用。

我的代码到目前为止：

$().ready(function () {
    $('.data-table tr .data').each(function () {
        string = $(this).text('Strong');
        $(this).html('<img src="strong.png" alt="' + string + '" />');
    });
});

</script>

表格标记为：

 <table class="data-table" id="product-attribute-specs-table">
    <colgroup><col width="25%">
    <col>
    </colgroup><tbody>
        <tr class="even">
            <th class="label">Coffee Strength</th>
            <td class="data last">Strong</td>
        </tr>
            </tbody>
</table>

任何帮助都将不胜感激。

Answer 1

尝试

jQuery(function ($) {
    $('.data-table tr .data').each(function () {
        var string = $.trim($(this).text());
        $(this).html('<img src="' + string + '.png" alt="' + string + '" />');
    });
});

演示：Fiddle

Answer 2

$('.data-table tr .data').html(function() {
    var currentText = $(this).text().toLowerCase();
    return '<img src="' + currentText + '.png" alt="' + currentText + '" />';
});

DEMO：http://jsfiddle.net/jRELP/

用JQuery替换文本与图像

2 个答案: