テーブル (html テーブルではなく) で最適なモデルを強調表示するソリューションを探しています。問題は、各モデルが複数のトリムで構成されていることです。たとえば、価格については、そのモデルの低価格から高価格までの範囲を表示します ($50.000 から $60000 のように)。
以下のスクリプトを使用して、その情報を持つ span タグ全体を強調表示できますが、セットアップ全体を台無しにすることなく、より低い価格、つまり 50.000 ドルだけを強調したいと思います。
明確にするために、変数 'best' の最初の値が下 (92.9) の場合、その値 ( li の上から 3 番目) を含むスパン タグにも 113.9 が含まれます。92.9 だけが強調表示されるようにします。113.9 はそのままにしておく必要があります。
強調したい場合にどうにかしてタグを追加する必要があることはわかっていますが、最良の値を適切に分離する方法については不十分でした。
ここでフィドルを参照してください: 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>
........