HTML要素の背景色を16進数で取得するにはどうすればよいですか?

要素の背景カラー コードを 16 進数で取得する方法

HTML 要素の背景カラー コードを 16 進形式で取得することは、Web 開発にとって不可欠です。 。提供したコード スニペットを詳しく調べて、これを実現する方法を詳しく説明します。

提供した JavaScript コード スニペット、console.log($(".div").css("background-color")) ; は、DOM 要素の計算された背景色スタイルにアクセスするために使用されます。デフォルトでは「rgb(245, 180, 5)」のような形式で色の値を取得します。ただし、希望する 16 進数形式 (#f5b405) ではありません。

「rgb」形式を 16 進数に変換するには、次の手法を使用できます。

使用正規表現 (例で提供されています)

提供された JavaScript 関数、 hexc() は、「rgb」形式でカラー値を受け取り、RGB 値を分割し、16 進数に変換し、それらを「#」接頭辞で結合することによって 16 進数に変換します。

使用jQuery プラグイン

カラーを「rgb」から「rgb」に変換するために利用できる jQuery プラグインが多数あります。 16進数。たとえば、jQuery Color プラグインは、16 進数のカラー コードを取得する hex() メソッドを提供します。

ここでは、jQuery プラグインを使用して DIV 要素の 16 進数のカラー コードを取得する拡張例を示します。

$(function() {
  $('div').on('click', function() {
    var hexColor = $(this).css('backgroundColor');
    console.log($('div').css('backgroundColor', hexColor));
  });
});

または、ColorZilla や Droplr などのカラー ピッカー ツールをブラウザにインストールすることもできます。これにより、簡単にアクセスできます。 16 進数を含むさまざまな形式での要素のカラー コード。

以上がHTML要素の背景色を16進数で取得するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。