0

グル、

私はこれを持っています。

<td style="width:100px">
Queued:465
Rejects:3897
Offers:31
</td>

そしてそれを次のようにする必要があります

<td style="width:100px">
<span class="label">Queued:</span><span class="data">465</span> <br>
<span class="label">Rejects:</span><span class="data">3897</span><br>
<span class="label">Offers:</span><span class="data">31</span>
</td>

1 行 (Queued:465 Rejects:3897 Offers:31) の代わりに、数字の後に休憩を入れたい (数字は動的です)。Queued、Rejects、Offers は固定されています。

これは私が試したものです。

$('td:contains(Queued:)').html(function() {
    return $(this).html().replace('Queued:', '<span class="label">Queued: </span>');
});
$('td:contains(Rejects:)').html(function() {
    return $(this).html().replace('Rejects:', '<br><span class="label">Rejects: </span>');
});
$('td:contains(Offers:)').html(function() {
    return $(this).html().replace('Offers:', '<br><span class="label">Offers: </span>');
});
4

2 に答える 2

4
$("td").html(function(i, val) {
    return $.trim(
        val.replace(/[a-z]+/ig, '<span class="label">$&</span>')
           .replace(/\d+/g, '<span class="data">$&</span>')
    ).replace(/\n/g, "<br />");
});

デモ: http://jsfiddle.net/dfRzY/

于 2013-03-11T15:32:52.010 に答える
0

正規表現ルートではなく、.splitルートをたどることもできます。

var $td = $("td"),
    rows = $td.html().trim().split("\n"),
    html = [];

for (var x=0; x<rows.length; x++){
  var line = rows[x].split(":");

  html.push(
    "<span class='label'>"+line[0]+":</span>"+
    "<span class='data'>"+line[1]+"</span>"
  );
}
$td.html(html.join("<br>"));

編集:フィドル

于 2013-03-11T15:51:58.423 に答える