1、網頁後退 /前進

<a href="javascript:history.go(-1);">後退</a>

<a href="javascript:history.go(1);">前進</a>

2、上下左右的ASCII碼值

上鍵：0 72
下鍵：0 80
左鍵：0 75
右鍵：0 77

3、 加密技術

本文一共介紹了七種方法：
　　一：最簡單的加密解密
　　二：轉義字符"\"的妙用
　　三：使用Microsoft出品的腳本編碼器Script Encoder來進行編碼 （自創簡單解碼）
　　四：任意添加NUL空字符（十六進制00H） （自創）
　　五：無用內容混亂以及換行空格TAB大法
　　六：自寫解密函數法
　　七：錯誤的利用 （自創）

　　在做網頁時（其實是網頁木馬呵呵），最讓人煩惱的是自己辛辛苦苦寫出來的客戶端IE運行的JAVASCRIPT代碼常常被別人輕易的拷貝，實在讓自己的心裏有點不是滋味，要知道自己寫點東西也挺累的......^*^

　　但我們也應該清楚地認識到因為JAVASCRIPT代碼是在IE中解釋執行，要想絕對的保密是不可能的，我們要做的就是盡可能的增大拷貝者復制的難度，讓他知難而退（但願~!~），下面我結合自己這幾年來的實踐，及個人研究的心得，和大家一起來探討一下網頁中JAVASCRIPT代碼的加密解密技術。

　　以加密下面的JAVASCRIPT代碼為例：

<SCRIPT LANGUAGE="JavaScript">
alert("黑客防線");
</SCRIPT>

　　一：最簡單的加密解密

　　大家對於JAVASCRIPT函數escape()和unescape()想必是比較了解啦（很多網頁加密在用它們），分別是編碼和解碼字符串，比如例子代碼用escape()函數加密後變為如下格式：

alert%28%22%u9ED1%u5BA2%u9632%u7EBF%22%29%3B

如何？還看的懂嗎？當然其中的ASCII字符"alert"並沒有被加密，如果願意我們可以寫點JAVASCRIPT代碼重新把它加密如下：

%61%6C%65%72%74%28%22%u9ED1%u5BA2%u9632%u7EBF%22%29%3B

　　呵呵！如何？這次是完全都加密了！

　　當然，這樣加密後的代碼是不能直接運行的，幸好還有eval(codeString)可用，這個函數的作用就是檢查JavaScript代碼並執行，必選項 codeString 參數是包含有效 JavaScript 代碼的字符串值，加上上面的解碼unescape()，加密後的結果如下：

<SCRIPT LANGUAGE="JavaScript">
var code=unescape("%61%6C%65%72%74%28%22%u9ED1%u5BA2%u9632%u7EBF%22%29%3B");
eval(code)
</SCRIPT>

　　是不是很簡單？不要高興，解密也就同樣的簡單，解密代碼都擺給別人啦（unescape()）！呵呵

　　二：轉義字符"\"的妙用

　　大家可能對轉義字符""不太熟悉，但對於JavaScript提供了一些特殊字符如：\n （換行）、 \r （回車）、\’ （單引號 ）等應該是有所了解的吧？其實"\"後面還可以跟八進制或十六進制的數字，如字符"a"則可以表示為："\141"或"\x61"（註意是小寫字符"x"），至於雙字節字符如漢字"黑"則僅能用十六進制表示為"\u9ED1"（註意是小寫字符"u"），其中字符"u"表示是雙字節字符，根據這個原理例子代碼則可以表示為：

　　八進制轉義字符串如下:
<SCRIPT LANGUAGE="JavaScript">
eval("\141\154\145\162\164\50\42\u9ED1\u5BA2\u9632\u7EBF\42\51\73")
</SCRIPT>

十六進制轉義字符串如下:
<SCRIPT LANGUAGE="JavaScript">
eval("\x61\x6C\x65\x72\x74\x28\x22\u9ED1\u5BA2\u9632\u7EBF\x22\x29\x3B")
</SCRIPT>

　　這次沒有了解碼函數，因為JavaScript執行時會自行轉換，同樣解碼也是很簡單如下：

<SCRIPT LANGUAGE="JavaScript">
alert("\x61\x6C\x65\x72\x74\x28\x22\u9ED1\u5BA2\u9632\u7EBF\x22\x29\x3B")
</SCRIPT>

　　就會彈出對話框告訴你解密後的結果！

　　三：使用Microsoft出品的腳本編碼器Script Encoder來進行編碼

　　工具的使用就不多介紹啦！我是直接使用JavaScript調用控件Scripting.Encoder完成的編碼！代碼如下：

<SCRIPT LANGUAGE="JavaScript">
var Senc=new ActiveXObject("Scripting.Encoder");
var code=‘<SCRIPT LANGUAGE="JavaScript">\r\nalert("黑客防線");\r\n<\/SCRIPT>‘;
var Encode=Senc.EncodeScriptFile(".htm",code,0,"");
alert(Encode);
</SCRIPT>

　　編碼後的結果如下：
<SCRIPT LANGUAGE="JScript.Encode">#@~^FgAAAA==@#@&ls DD`J黑客防線r#p@#@&FgMAAA==^#~@</SCRIPT>

　　夠難看懂得吧？但相應的解密工具早已出來，而且連解密網頁都有！因為其解密網頁代碼過多，我就不多說拉！給大家介紹一下我獨創的解密代碼，如下：

<SCRIPT LANGUAGE="JScript.Encode">
function decode()
alert(decode.toString());
</SCRIPT>

　　咋樣？夠簡單吧？它是原理是：編碼後的代碼運行前IE會先對其進行解碼，如果我們先把加密的代碼放入一個自定義函數如上面的decode()中，然後對自定義函數decode調用toString()方法，得到的將是解碼後的代碼！

　　如果你覺得這樣編碼得到的代碼LANGUAGE屬性是JScript.Encode，很容易讓人識破，那麽還有一個幾乎不為人知的window對象的方法execScript()，其原形為：

window.execScript( sExpression, sLanguage )

　　參數：
　　sExpression: 必選項。字符串(String)。要被執行的代碼。
　　sLanguage　: 必選項。字符串(String)。指定執行的代碼的語言。默認值為 Microsoft JScript

　　使用時，前面的"window"可以省略不寫！

　　利用它我們可以很好的運行編碼後的JavaScript代碼，如下：

<SCRIPT LANGUAGE="JavaScript">
execScript("#@~^FgAAAA==@#@&ls DD`J黑客防線r#p@#@&FgMAAA==^#~@","JScript.Encode")
</SCRIPT>

　　你可以利用方法二對其中的""號內的字符串再進行編碼，使得"JScript.Encode"以及編碼特征碼"#@~^"不出現，效果會更好！

　　四：任意添加NUL空字符（十六進制00H）

　　一次偶然的實驗，使我發現在HTML網頁中任意位置添加任意個數的"空字符"，IE照樣會正常顯示其中的內容，並正常執行其中的JavaScript 代碼，而添加的"空字符"我們在用一般的編輯器查看時，會顯示形如空格或黑塊，使得原碼很難看懂，如用記事本查看則"空字符"會變成"空格"，利用這個原理加密結果如下：（其中顯示的"空格"代表"空字符"）

<S C RI P T L ANG U A G E

=" J a v a S c r i p t ">

a l er t (" 黑 客 防 線") ;

< / SC R I P T>
　　
　　如何？是不是顯得亂七八糟的？如果不知道方法的人很難想到要去掉裏面的"空字符"（00H）的！

　　五：無用內容混亂以及換行空格TAB大法

　　在JAVASCRIPT代碼中我們可以加入大量的無用字符串或數字，以及無用代碼和註釋內容等等，使真正的有用代碼埋沒在其中，並把有用的代碼中能加入換行、空格、TAB的地方加入大量換行、空格、TAB，並可以把正常的字符串用""來進行換行，這樣就會使得代碼難以看懂！如我加密後的形式如下：

<SCRIPT LANGUAGE="JavaScript">
"xajgxsadffgds";1234567890
625623216;var $=0;alert//@$%%&*()(&(^%^
//cctv function//
(//hhsaasajx xc
/*
asjgdsgu*/
"黑

客
防線"//ashjgfgf
/*
@#%$^&%$96667r45fggbhytjty
*/
//window
)
;"#@$#%@#432hu";212351436
</SCRIPT>

　　至少如果我看到這樣的代碼是不會有心思去分析它的，你哪？

　　六：自寫解密函數法

　　這個方法和一、二差不多，只不過是自己寫個函數對代碼進行解密，很多VBS病毒使用這種方法對自身進行加密，來防止特征碼掃描！下面是我寫的一個簡單的加密解密函數，

加密代碼如下（詳細參照文件"加密.htm"）：
<SCRIPT LANGUAGE="JavaScript">
function compile(code)
{
var c=String.fromCharCode(code.charCodeAt(0)+code.length);
for(var i=1;i<code.length;i++){
c+=String.fromCharCode(code.charCodeAt(i)+code.charCodeAt(i-1));
}
alert(escape(c));
}
compile(’alert("黑客防線");’)
</SCRIPT>

運行得到加密結果為：o%CD%D1%D7%E6%9CJ%u9EF3%uFA73%uF1D4%u14F1%u7EE1Kd

相應的加密後解密的代碼如下：

<SCRIPT LANGUAGE="JavaScript">
function uncompile(code)
{
code=unescape(code);
var c=String.fromCharCode(code.charCodeAt(0)-code.length);
for(var i=1;i<code.length;i++){
c+=String.fromCharCode(code.charCodeAt(i)-c.charCodeAt(i-1));
}
return c;
}
eval(uncompile("o%CD%D1%D7%E6%9CJ%u9EF3%uFA73%uF1D4%u14F1%u7EE1Kd"));
</SCRIPT>

　　七：錯誤的利用

　　利用try{}catch(e){}結構對代碼進行測試解密，雖然這個想法很好（呵呵，誇誇自己），因為實用性不大，我僅給個例子

<SCRIPT LANGUAGE="JavaScript">

var a=’alert("黑客防線");’;
var c="";
for(var i=0;i<a.length;i++){
c+=String.fromCharCode(a.charCodeAt(i)^61);}

alert(c);

//上面的是加密代碼，當然如果真正使用這個方法時，不會把加密寫上的
//現在變量c就是加密後的代碼

//下面的函數t()先假設初始密碼為０，解密執行，
//遇到錯誤則把密碼加１，然後接著解密執行，直到正確運行

var d=c; //保存加密後的代碼
var b=0; //假定初始密碼為0
t();

function t(){
try{eval(c);}
catch(e){
c="";
for(var i=0;i<d.length;i++){
c+=String.fromCharCode(d.charCodeAt(i)^b);}
b+=1;
t();
//setTimeout("t()",0);
}
}

</SCRIPT>

5、瀑布流

瀑布流是目前一種比較流行的頁面布局和加載效果。百度，花瓣等一些好的網站都廣泛用了這樣一種效果，適用於單頁面展示對內容的頁面。這幾天就跟著一些資料學習了一下瀑布流效果的制作。其原理是利用js動態的改變絕對定位的位置，然後對滾動條的事件監聽，加載數據。現在為大家分享下JS代碼，希望路過的大神多多指教。其具體實現步驟在代碼註釋中體現，博文最後有源代碼資源，供大家免費交流學習……

HTML代碼：

<!doctype html>

<html>

<head>

<meta charset="UTF-8">

<title>瀑布流</title>

<style>

div{

background: #ccc;

width: 200px;

position: absolute;

transition:0.5s; /*把鼠標指針放到 div 元素上，其寬度會從 200px 逐漸變為 350px*/

}

</style>

</head>

<body>

<script>

createDiv ()

function createDiv () {

for (var i = 0; i < 20; i++) {

var div = document.createElement(‘div‘);

var rnd = Math.floor(Math.random()*300+50) //div的高度在50到350之間

div.style.height = rnd + "px";

div.innerHTML = i;

document.body.appendChild(div);

};

change() // 該事件僅在 Style 屬性設置為 0（下拉 Combo）或 1（簡單 Combo）和正文被改變或者通過代碼改變了 Text 屬性的設置時才會發生。

}

function change() {

var aDiv = document.getElementsByTagName(‘div‘);

// alert(aDiv.length);

var windowCW = document.documentElement.clientWidth; //窗口視口的寬度

var n = Math.floor(windowCW/210); //一行能容納多少個div，並向下取整

if (n<=0) {return}; // alert(n);

var t = 0;

var center = (windowCW - n*210)/2; //居中

var arrH = []; //定義一個數組存放div的高度

for (var i = 0; i < aDiv.length; i++) {

var j = i%n;

if (arrH.length==n) { //一行排滿n個後到下一行

var min = findMin(arrH); //從最“矮”的排起，可以從下圖的序號中看得出來，下一行中序號是從矮到高排列的

aDiv[i].style.left =center + min*210 + "px";

aDiv[i].style.top = arrH[min]+10 + "px";

arrH[min] += aDiv[i].offsetHeight + 10; // alert(min);

}else{

arrH[j] = aDiv[i].offsetHeight;

aDiv[i].style.left =center + 200*j+10*j + "px";

aDiv[i].style.top = 0;

}

}; }

window.onresize = function(){ //窗口改變也調用函數 onresize 事件會在窗口或框架被調整大小時發生。

change(); }

window.onscroll= function () { //onscroll 事件在元素滾動條在滾動時觸發。

// 頁面總高度 var bodyHeight = document.documentElement.offsetHeight;

// 可視區高度 var windowHeight = document.documentElement.clientHeight;

//滾動條的高度 var srcollTop = document.documentElement.scrollTop || document.body.scrollTop;

var srcollH = document.body.scrollHeight; // alert(srcollH);

if (srcollTop+windowHeight >= srcollH-20) {

createDiv(); }; }

function findMin(arr) {

var m = 0;

for (var i = 0; i < arr.length; i++) {

m = Math.min(arr[m], arr[i]) == arr[m] ? m : i;

}

return m; }

</script>

</body>

</html>

7.6隨筆