JavaScript实现16进制颜色值转RGB的方法
JavaScript实现16进制颜色值转RGB的方法
发布时间:2016-12-30 来源:查字典编辑
摘要:本文实例讲述了JavaScript实现16进制颜色值转RGB的方法。分享给大家供大家参考。具体实现方法如下:复制代码代码如下:16进制颜色值...

本文实例讲述了JavaScript实现16进制颜色值转RGB的方法。分享给大家供大家参考。具体实现方法如下:

复制代码 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>16进制颜色值转RGB</title>

<style>

*{margin:0;padding:0;font-family:'Microsoft yahei'}

.replace{width:400px;height:210px;margin:0 auto;padding-top:40px;}

.title{text-align:center;display:block}

form{width:200px;margin:30px auto;}

input{outline:none;}

input[type="button"]{cursor:pointer;}

</style>

<script>

function hexToR(h) {

return parseInt((cutHex(h)).substring(0, 2), 16)

}

function hexToG(h) {

return parseInt((cutHex(h)).substring(2, 4), 16)

}

function hexToB(h) {

return parseInt((cutHex(h)).substring(4, 6), 16)

}

function cutHex(h) {

return h.charAt(0) == "#" ? h.substring(1, 7) : h

}

function setBgColorById(id, sColor) {

var elems;

if (document.getElementById) {

if (elems = document.getElementById(id)) {

if (elems.style) elems.style.backgroundColor = sColor;

}

}

}

</script>

</head>

<body>

<div>

<span>JavaScript原生16进制颜色值转RGB值</span>

<form name="rgb">

<input value="ffffff" maxlength="7" size="16" name="hex" />

<input value="转换" type="button" name="btn"/>

<br /><br />

R:<input size="3" name="r" />

G:<input size="3" name="g" />

B:<input size="3" name="b" />

</form>

</div>

</body>

</html>

运行效果如下图所示:

JavaScript实现16进制颜色值转RGB的方法1

希望本文所述对大家的javascript程序设计有所帮助。

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类