如何使用 JavaScript 以十六進位程式碼形式取得 Web 元素的背景顏色？

取得元素背景的十六進位顏色代碼

使用網頁元素時，以十六進位格式擷取背景顏色代碼的能力對於各種樣式非常有用和設計目的。這個問題深入研究了使用者需要利用 JavaScript 和 CSS 來獲取元素的背景顏色程式碼。

程式碼實作

要取得背景顏色程式碼，可以使用 JavaScript 的 css() 函數。例如，如果您想要檢索

的背景顏色代碼；類別名為「div」的元素，可以使用以下程式碼片段：

console.log($(".div").css("background-color"));

此程式碼使用jQuery 函式庫存取元素，然後使用css( ) 函數檢索值對於「背景顏色」屬性。產生的十六進位格式的背景顏色代碼將記錄到控制台。

用於十六進位轉換的自訂函數

或者，可以定義自訂JavaScript 函數來轉換從css 擷取的顏色值() 函數轉換為十六進位格式。以下是一個範例：

var color = '';
$('div').click(function() {
  var x = $(this).css('backgroundColor');
  hexc(x);
  console.log(color);
})

function hexc(colorval) {
  var parts = colorval.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
  delete(parts[0]);
  for (var i = 1; i <= 3; ++i) {
    parts[i] = parseInt(parts[i]).toString(16);
    if (parts[i].length == 1) parts[i] = '0' + parts[i];
  }
  color = '#' + parts.join('');
}

在此範例中，hexc() 函數將 RGB 顏色值作為輸入並將其轉換為十六進位格式。當

出現時呼叫該函數。單擊元素。產生的十六進位顏色代碼儲存在顏色變數中並記錄到控制台。

其他資源

有關實際演示，請參閱原​​始問題中提供的程式碼範例連結。按一下 div 元素以十六進位格式檢索其背景顏色值。

以上是如何使用 JavaScript 以十六進位程式碼形式取得 Web 元素的背景顏色？的詳細內容。更多資訊請關注PHP中文網其他相關文章！