dataTables.jsの表で、項目ごとの最大値、最大値を取得したいです

Question

環境：Wordpress(4.4)
ブラウザ：Chrome（最新）、Firefox（最新）

※特にWordpressに依存している質問ではありません

HTMLテーブルを整形し、うまく表として表示するjQueryのプラグインに「dataTables.js」というものがあります。
こちらを使って表を表示しています。

この表から、項目ごとの最大値、最小値を取得し、色分けしたいというのが、質問の内容となります

プラグインのオフィシャルサイト：
http://legacy.datatables.net/index

例えば列の項目名として「りんご」「みかん」「なし」とあった場合、「りんご」の所有個数の最大値、最小値、「みかん」の所有個数の最大値、最小値、に対してそれぞれ最大値＞青色、最小値＞赤色などの表示にしたい、というイメージになります。

ネットで調べてみましたが、ぴったりな内容が見つかりませんでしたので、こちらで良いお答えがいただけますとうれしいです。

よろしくお願いいたします。

Answer 1

たとえば、1番目の列の最大値を青字にするならこうです。

var max = $('tbody tr:eq(0)').find('td:eq(0)') 
$('tbody tr').find('td:eq(0)').each(function(){
  var target = $(this);
  if (parseFloat(max.text()) < parseFloat(target.text())) {max = target;}
});
max.css('color', 'blue');  

ソートやページングで崩れるかと思いましたが、DOMを保存しているようなので問題ありませんでした。
なお、1位タイなどの処理は考えていませんので、その辺が必要でしたら工夫してみてください。

このページ上でスクリプトを動かして動作確認しました。
https://datatables.net/examples/advanced_init/html5-data-attributes.html

Comments

[suzuyan]

素晴らしくぴったりなご回答をありがとうございます。

こちらを元に意図する表示にすることが出来ました。
色々と難しいこと考えていましたが、JavaScript（jQuery）の基本的な手法で解決できたのですね・・・。

またここから色々と勉強したいと思います。