[英]jquery wrap elements with div
大师,
我有这个。
<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>
我想在一行数字之后休息一下(它们是动态的),而不是一行(队列:465拒绝:3897报价:31)。 排队,拒绝,报价是固定的。
这就是我尝试过的。
$('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>');
});
$("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/
您也可以沿着.split路由而不是Regex路由。
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>"));
编辑: 小提琴
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.