开发学院网页设计 JavaScript 用Javascript实现数据加密解密效果阅读

用Javascript实现数据加密解密效果

　2009-04-22 20:04:50　来源：WEB开发网　　　

核心提示：加密.hta代码(完全可以保存为html，执行效果一样) 程序代码<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"><head><meta http-equiv="Content-Type" cont

加密.hta代码(完全可以保存为html，执行效果一样)

程序代码
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>设置加密邮件内容</title>
<script type="text/javascript">
function itArt(){
　　　 this.html="Hello";
　　　 this.CSS="color:#000;width:640px;text-indent:20px;padding:5px;border:solid 5px #666;margin:5px;background:#CCC;margin-left:auto;margin-right:auto";
　　　 this.length=0;
}

itArt.PRototype = {
　　　 init:function(){
　　　　　　　 this.length=this.html.length;
　　　 },
　　　 play:function(){
　　　　　　　 this.init();
　　　　　　　 this.setPassWord();
　　　　　　　 this.echo();
　　　 },
　　　 setHtml:function(v){
　　　　　　　 this.html=v;
　　　 },
　　　 setPassword:function(){
　　　　　　　 var tmp="";
　　　　　　　 for(var i=0;i<this.length;i++){
　　　　　　　　　　　 tmp+="$"+this.html.charCodeAt(i);
　　　　　　　 }
　　　　　　　 this.html=tmp;
　　　　　　　 tmp="";
　　　　　　　 for(var i=0;i<this.html.length;i+=3){
　　　　　　　　　　　 tmp+=" "+this.html.substr(i,3);
　　　　　　　 }
　　　　　　　 this.html=tmp;
　　　　　　　 tmp="";
　　　　　　　 for(var i=0;i<this.html.length;i++){
　　　　　　　　　　　 tmp+=" "+this.html.charCodeAt(i);
　　　　　　　 }
　　　　　　　 this.html=tmp;
　　　 },
　　　 echo:function(){
　　　　　　　 var t=document.createElement("div");
　　　　　　　 t.innerHTML=this.html;
　　　　　　　 if(window.ActiveXObject)
　　　　　　　　　　　 t.style.cssText=this.css;
　　　　　　　 else
　　　　　　　　　　　 t.setAttribute("style",this.css);
　　　　　　　 //不想用DOM删掉子元素了，反正各浏览器都支持
　　　　　　　 document.getElementById("x100").innerHTML="";
　　　　　　　 document.getElementById("x100").appendChild(t);
　　　 }
}
function setPassword(t){
　　　 if(t!=""){
　　　　　　　 var demo=new itArt();
　　　　　　　 demo.setHtml(t);
　　　　　　　 demo.play();
　　　 }else{
　　　　　　　 alert("请输入内容开始加密");
　　　 }
}
window.onload=function(){
　　　 setPassword("你好，猜猜我给你的密文是什么？哈哈，猜不到吧");
}
</script>
</head>
<body>
<textarea style="display:block;color:#000;width:640px;height:280px;text-indent:20px;border:solid 5px #666;margin:5px;background:#FFF;margin-left:auto;margin-right:auto" ondblclick="setPassword(this.value);" title="双击开始加密">你好，猜猜我给你的密文是什么？哈哈，猜不到吧</textarea>
<div id="x100">
</div>
</body>
</html>

解密

程序代码

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>获取加密邮件内容</title>
<script type="text/Javascript">
function itArt(){
　　　 this.html="Hello";
　　　 this.css="color:#000;width:640px;text-indent:20px;padding:5px;border:solid 5px #666;margin:5px;background:#CCC;margin-left:auto;margin-right:auto";
　　　 this.length=0;
}

itArt.prototype = {
　　　 init:function(){
　　　　　　　 this.length=this.html.length;
　　　 },
　　　 play:function(){
　　　　　　　 this.init();
　　　　　　　 this.setPassword();
　　　　　　　 this.echo();
　　　 },
　　　 setHtml:function(v){
　　　　　　　 this.html=v;
　　　 },
　　　 setPassword:function(){
　　　　　　　 var tmp=this.html.split(" "),tmps="";
　　　　　　　 for(i=0;i<tmp.length;i++){
　　　　　　　　　　　 tmps+=String.fromCharCode(tmp[i]);
　　　　　　　 }
　　　　　　　 this.html=tmps.replace(" ","");
　　　　　　　 tmps="";
　　　　　　　 tmp=this.html.split("$");
　　　　　　　 for(i=0;i<tmp.length;i++){
　　　　　　　　　　　 if(tmp[i]!=""&&tmp[i]!=0){
　　　　　　　　　　　　　　　 tmps+=String.fromCharCode(tmp[i].replace(" ",""));
　　　　　　　　　　　 }
　　　　　　　 }
　　　　　　　 this.html=tmps;
　　　 },
　　　 echo:function(){
　　　　　　　 var t=document.createElement("div");
　　　　　　　 t.innerHTML=this.html;
　　　　　　　 if(window.ActiveXObject)
　　　　　　　　　　　 t.style.cssText=this.css;
　　　　　　　 else
　　　　　　　　　　　 t.setAttribute("style",this.css);
　　　　　　　 //不想用DOM删掉子元素了，反正各浏览器都支持
　　　　　　　 document.getElementById("x100").innerHTML="";
　　　　　　　 document.getElementById("x100").appendChild(t);
　　　 }
}

demo=new itArt();
demo.setHtml();
function getPassword(t){
　　　 if(t!=""){
　　　 var demo=new itArt();
　　　 demo.setHtml(t);
　　　 demo.play();
　　　 }else{
　　　　　　　 alert("请输入内容开始解密");
　　　 }
}
window.onload=function(){
　　　 getPassword("32 36 50 48 32 51 50 48 32 36 50 50 32 57 48 57 32 36 54 53 32 50 57 50 32 36 50 57 32 52 54 56 32 36 50 57 32 52 54 56 32 36 50 53 32 49 48 53 32 36 51 50 32 52 55 51 32 36 50 48 32 51 50 48 32 36 51 48 32 51 52 48 32 36 50 51 32 52 57 52 32 36 50 53 32 57 57 49 32 36 50 54 32 49 53 57 32 36 50 48 32 49 54 48 32 36 50 48 32 48 52 48 32 36 54 53 32 51 49 49 32 36 51 50 32 36 50 49 32 55 48 52 32 36 50 49 32 55 48 52 32 36 54 53 32 50 57 50 32 36 50 57 32 52 54 56 32 36 49 57 32 57 56 49 32 36 50 49 32 48 52 48 32 36 50 49 32 53 52 51");
}
</script>
</head>
<body>
<textarea style="display:block;color:#000;width:640px;height:280px;text-indent:20px;border:solid 5px #666;margin:5px;background:#FFF;margin-left:auto;margin-right:auto" ondblclick="getPassword(this.value);" title="双击开始解密">32 36 50 48 32 51 50 48 32 36 50 50 32 57 48 57 32 36 54 53 32 50 57 50 32 36 50 57 32 52 54 56 32 36 50 57 32 52 54 56 32 36 50 53 32 49 48 53 32 36 51 50 32 52 55 51 32 36 50 48 32 51 50 48 32 36 51 48 32 51 52 48 32 36 50 51 32 52 57 52 32 36 50 53 32 57 57 49 32 36 50 54 32 49 53 57 32 36 50 48 32 49 54 48 32 36 50 48 32 48 52 48 32 36 54 53 32 51 49 49 32 36 51 50 32 36 50 49 32 55 48 52 32 36 50 49 32 55 48 52 32 36 54 53 32 50 57 50 32 36 50 57 32 52 54 56 32 36 49 57 32 57 56 49 32 36 50 49 32 48 52 48 32 36 50 49 32 53 52 51</textarea>
<div id="x100">
</div>
</body>
</html>