js实现RGB颜色值转换成HEX颜色值代码

六月初六月初 JavaScipt 2022-09-08 11:27:43

颜色值格式互转在应用和开发中使用非常频繁，频繁的使用和应用也促使着如何将该操作进行简化，如果每次都需要请求后端来实现该操作，可以想象频繁的请求带来的连锁反应。

介于此，我们如何使用js实现将RGB格式颜色值转换成HEX十六进制格式颜色值呢？

效果如图：


实现代码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>RGB格式转十六进制颜色格式</title>
	</head>
	<body>
		<script>
			function rgbTohex(a, b, c) {
			  let _this = this
			  let r = /^\d{1,3}$/;
			  if (!r.test(a) || !r.test(b) || !r.test(c)) return alert('输入错误的hex颜色值');
			  let hexs = [a.toString(16), b.toString(16), c.toString(16)];
			  for (let i = 0; i < 3; i++) if (hexs[i].length == 1) hexs[i] = "0" + hexs[i];
			  return "#" + hexs.join("");
			}
			console.log("转换前RGB格式：0,0,0")
			console.log("转换后HEX十六进制："+rgbTohex(0,0,0))
		</script>
	</body>
</html>

代码详解：

1、方法对应的参数为RGB

2、参数位置不能有改变

六月初字帖坊小程序 你想要的字帖模板及工具，这里都有！