jquery - 更改 span 部分的 css

Question

我正在寻找一种解决方案来突出显示表格(不是 html 表格)中的最佳模型。问题是每个模型都由多个装饰组成。因此，例如，对于价格，我显示了该型号从低价到最高价的范围，例如 50.000 美元 - 60000 美元。

我可以使用下面的脚本突出显示包含该信息的整个 span 标签，但我只想突出显示较低的价格，即 50.000 美元，而不会弄乱我的整个设置。

为澄清起见，对于下方变量“best”中的第一个值 (92.9)，包含该值的跨度标签(li 上从顶部数第三个)也包含 113.9。我希望仅突出显示 92.9。 113.9 应保持原样。

我知道我必须以某种方式为那些我想突出显示的案例添加一个标签，但我未能正确区分最佳值。

请在此处查看 fiddle :http://jsfiddle.net/SnYWL/

<script>
$(document).ready(function(){
    var best = ['92.9','74.9','17','197','4.1','106','774'];//simplified
    var order = [5, 8, 12, 14, 15, 16, 19];
for(var i=0; i<7 ;i++){

$("#modinfo li span:nth-child(" + order[i] + ")").each(function(){
  var best_val=$(this).text();
if(best_val.indexOf(best[i]) > -1){
    $(this).css('color','#33cc00');
}
});
}
});
</script>

表格由一系列 li 元素组成，如下例所示:

    <ul id="modinfo">

<li>
    <span class="z1">i10</span>
    <span class="z2">3</span>
    <span class="z1">92.9-113.9</span>
            <span class="z5">5.2-5.7</span>
            <span class="z6">86.4-101.5</span>
    <span class="z1">ilim</span>
    <span class="z2">6</span>
    <span class="z1">69</span>      
            <span class="z2">4.7 a 5.8</span>
            <span class="z1">111</span>
    <span class="z1">5</span>
    <span class="z2">225</span>
            </li>

........

Answer 1

如何用样式化的 span 替换目标值？

喜欢

$(this).html(best_val.replace(best[i], "<span style='color:#33cc00'>" + best[i] + "</span>"));

Fiddle