jQuery が CSS スタイルでカラー値を取得する問題、ブラウザ形式ごとに異なる解決策_jquery

jQueryを使用してスタイルのbackground-colorの値を取得すると、IE10未満のバージョンでは取得した色の値がHEX形式[#ffff00]で表示されるのに対し、IE10、Chrome、FirefoxではHEX形式[#ffff00]で表示されることがわかりました。 GRB 形式。[rgb(255,0,0)] を表示します。カラー値を判断して処理する必要があるため、処理を容易にするために統一されたカラー形式 (できれば HEX 形式) を取得する必要があります。検索した結果、海外の Web サイトからコードを入手しました:

コードをコピーします コードは次のとおりです:

$.fn.getHexBackgroundColor = function() {
var rgb = $(this).css('background-color');
rgb = rgb.match(/^rgb(( d ),s *(d ),s*(d ))$/);
function hex(x) {return ("0" parseInt(x).toString(16)).slice(-2); }
return rgb= "#" hex(rgb[1]) hex(rgb[2]) hex(rgb[3]);
}

上記の定義はjQuery 関数では、$("#bg").getHexBackgroundColor(); を通じてタグ id="bg" を持つ背景色の RGB 値を取得できます。

小さな変更を加えてみましょう。つまり、HEX 値が表示されている場合 (IE10 未満)、IE 以外のブラウザの場合は、値を RGB 形式に変換します。 🎜>

コードをコピーします コードは次のとおりです。

$.fn.getBackgroundColor = function() {
var rgb = $(this ).css('background-color');
if(rgb >= 0) return rgb;//16 進値の場合は直接返します
else{
rgb = rgb.match(/ ^rgb((d ),s*(d ),s*(d ))$/);
function hex(x) {return ("0" parseInt(x) ).toString(16)).slice( -2);}
rgb= "#" hex(rgb[1]) hex(rgb[2]) hex(rgb[3]);
}
return rgb;
}