JS实现 字符、十进制数字、 二进制、之间的相互转化

加密使用的是MD5.js进行加密,可以自己下载

 

集体效果如图所示:

以下是代码部分:

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4   <meta charset="UTF-8">
 5   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6   <meta http-equiv="X-UA-Compatible" content="ie=edge">
 7   <title></title>
 8   <style media="screen">
 9     input{
10       position: relative;;
11       top: -50px;
12       margin: 0 10px;
13     }
14   </style>
15 </head>
16 <body>
17   <div class="">
18     <textarea name="text" id="text1" rows="8" cols="20"></textarea>
19     <input type="button" id="changeTwo" name="btn1" value="转化为二进制">
20     <textarea name="toText" id="text2" rows="8" cols="20"></textarea>
21     <input type="button" id="hash" name="btn2" value="加密">
22     <textarea name="MD5Text" id="text3" rows="8" cols="20"></textarea>
23     <input type="button" id="realve" name="btn3" value="二进制转化为字符">
24     <textarea name="jiemi" id="text4" rows="8" cols="20"></textarea>
25   </div>
26 
27   <script src="md5.js"></script>
28   <script type="text/javascript">
29     window.onload=function(){
30       var oBtn1=document.getElementById('changeTwo');
31       var oBtn2=document.getElementById('hash');
32       var oBtn3=document.getElementById('realve');
33       var oText1=document.getElementById('text1');
34       var oText2=document.getElementById('text2');
35       var oText3=document.getElementById('text3');
36       var oText4=document.getElementById('text4');
37       oBtn1.onclick=function(){
38         var text1=oText1.value;
39         // console.log('编码前:'+ text1);
40         var total2str = "";
41         for (var i = 0; i < text1.length; i++) {
42             var num10 = text1.charCodeAt(i);  //以10进制的整数返回 某个字符 的unicode编码
43             var str2 = num10.toString(2);   //将10进制数字 转换成 2进制字符串
44 
45             if( total2str == "" ){
46               total2str = str2;
47             }else{
48               total2str = total2str + " " + str2;
49             }
50         }
51         oText2.value=total2str;
52         // console.log("编码后:" + total2str);
53         oBtn2.onclick=function(){
54           var Md5=hex_md5(total2str);
55           oText3.value=Md5;
56         }
57 
58         oBtn3.onclick=function(){
59           var goal = "";
60           var arr = total2str.split(' ');
61           for(var i=0; i < arr.length; i++){
62             var str2 = arr[i];
63             var num10 = parseInt(str2, 2); // 2进制字符串转换成 10进制的数字
64             goal += String.fromCharCode(num10); // 将10进制的unicode编码, 转换成对应的unicode字符
65           }
66             // console.log('解码后:'+ goal );
67             oText4.value=goal;
68         }
69         };
70       };
71   </script>
72 </body>
73 </html>

 

posted @ 2017-06-13 17:17  夏至未至~  阅读(2904)  评论(0编辑  收藏  举报