JavaScript RGB轉換成16進位制顏色

本章節介紹一下利用JavaScript將RGB顏色轉換為16進位制顏色值。

程式碼例項如下:

[JavaScript] 純文字檢視 複製程式碼執行程式碼
var rgb = "rgb(160,100,150)";
var oxColor = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
delete (oxColor[0]);
for (var n = 1; n <= 3; ++n) {
  oxColor[n] = parseInt(oxColor[n]).toString(16);
  if (oxColor[n].length == 1) oxColor[n] = '0' + oxColor[n];
}
var str = "#"+oxColor.join('');
console.log(str);

上面的程式碼實現了轉換效果，下面介紹一下它的實現過程。

一.程式碼註釋:

（1）.var rgb = "rgb(160,100,150)"，一個rgb顏色值字串。

（2）.var oxColor = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/)，匹配rgb顏色字串的正規表示式，能夠獲取括號中的160、100和150三個數字。

（3）.delete (oxColor[0]) ，刪除陣列中的第一個元素。

（4）.for (var n = 1; n <= 3; ++n) {

  oxColor[n] = parseInt(oxColor[n]).toString(16);

  if (oxColor[n].length == 1) oxColor[n] = '0' + oxColor[n];

}，使用for迴圈進行遍歷操作，將匹配獲取的三個數字轉換為16禁止，如果轉換後的數字是一位，那麼前面加0。

（5）.var str = "#"+oxColor.join('')，進行字串連線操作。

二.相關閱讀:

（1）.match()參閱正規表示式match()一章節。

（2）.parseInt()參閱JavaScript parseInt()一章節。

（3）.join()參閱JavaScript join()一章節。