color:<input type="text" id="color"> op:<input type="text" id="op" value="" /><input value="颜色转换" type="button" id="btn"> <div id="writeBox"></div> <script type="text/javascript"> function $(id){ return typeof id === "object" ? id : document.getElementById(id); } window.onload = function(){ $("btn").onclick = function(){ var c = new ColorChange(); c.init(); }; } function ColorChange(){ this.colorBox = $("color"); this.tex = $("op"); this.wBox = $("writeBox"); }; ColorChange.prototype = { color : function(){ var c = this.colorBox,v = c.value; if (v=="") { return false; }; if(v.indexOf("#")>0){ v = v.substring(1,v.length); }; var b=new Array(); for(x=0;x<3;x++){ b[0]=v.substr(x*2,2); b[3]="0123456789abcdef"; b[1]=b[0].substr(0,1); b[2]=b[0].substr(1,1); b[20+x]=b[3].indexOf(b[1])*16+b[3].indexOf(b[2]); }; var R = b[20],G = b[21],B = b[22]; this.wBox.innerHTML += ("RGB("+R+","+G+","+B+")<br>"); }, ap : function(){ var a = this.tex.value; if(a==""){return false;} var num = Math.floor((Math.floor(a*100)/100)*255); var num_10 = (Math.floor(a*100)/100); var num_change = num.toString(16); if (num_change.length == 1){ num_change = "0" + num_change; }; var o = num_change.toUpperCase(); this.wBox.innerHTML += ("透明度:"+o+"<br>"); }, init:function(){ this.color(); this.ap(); } }; </script>