Comment convertir des valeurs de couleur RVB en valeurs hexadécimales dans jQuery ?

Obtention de valeurs de couleur hexadécimale à partir des couleurs RVB dans jQuery

Problème :

Dans jQuery, la méthode css() obtient la couleur d'arrière-plan d'un élément sous forme de valeurs Rouge, Vert et Bleu (RVB) au format rgb(r, g, b). Cependant, une exigence courante consiste à récupérer la valeur de couleur hexadécimale équivalente, telle que #FFFFFF.

Solution :

La méthode traditionnelle pour obtenir une valeur hexadécimale à partir de RVB implique conversion manuelle, ce qui peut être fastidieux. Heureusement, une fonction concise sur une seule ligne permet d'y parvenir :

const rgba2hex = (rgba) => `#${rgba.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+\.{0,1}\d*))?\)$/).slice(1).map((n, i) => (i === 3 ? Math.round(parseFloat(n) * 255) : parseFloat(n)).toString(16).padStart(2, '0').replace('NaN', '')).join('')}`

Cette fonction traite à la fois les formats RVB et RGBA, garantissant la polyvalence.

Exemple d'utilisation :

const element = $('#selector');
const rgbColor = element.css('backgroundColor');
const hexColor = rgba2hex(rgbColor);

Réponse mise à jour pour les navigateurs modernes :

Depuis le solution originale, la prise en charge du navigateur pour les fonctionnalités ECMAScript 2015 s'est considérablement améliorée. Cela permet une conversion RVB en hexadécimal plus simple et plus concise :

const rgb2hex = (rgb) => `#${rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/).slice(1).map(n => parseInt(n, 10).toString(16).padStart(2, '0')).join('')}`

Cette fonction offre des fonctionnalités similaires, s'adressant spécifiquement aux formats de couleurs RVB.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!