加密使用的是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>