壓縮不僅僅可以提高用戶的下載速度,同時(shí)還可以加密代碼,下面說下一個(gè)常用的js壓縮方法:
首先使用dojo的工具shrinksafe(http://shrinksafe.dojotoolkit.org/)壓縮一下,dojo的這個(gè)工具會去掉注釋,他的壓縮不是簡單的替換變量,而是利用了mozilla的一個(gè)工具,對js解析后才壓縮,確保壓縮后的代碼不會出錯(cuò)。
dojo壓縮后,并不會減少太多,下一步可以使用http://javascriptcompressor.com/這個(gè)站點(diǎn)進(jìn)行更高層次的壓縮,可惜只能登陸這個(gè)站點(diǎn)再壓縮,只能將你的js代碼復(fù)制的他的文本框,然后等他的壓縮輸出
經(jīng)過這2步,你的js會變得既安全,文件又小
===========================
壓縮JS代碼:
packer – 最好用的 javascript 壓縮工具
地址:
http://dean.edwards.name/packer/
http://kan.willin.org/?page_id=1288
恢復(fù)JSMIN等工具壓縮的JS代碼:
Javascript Beautifier能夠?qū)smin壓縮后的js文件內(nèi)容重新恢復(fù)成可讀性很好的js文件。
網(wǎng)頁版:http://jsbeautifier.org
事件 | 瀏覽器支持 | 描述 |
onClick | IE3|N2|O3 | 鼠標(biāo)點(diǎn)擊事件,多用在某個(gè)對象控制的范圍內(nèi)的鼠標(biāo)點(diǎn)擊 |
onDblClick | IE4|N4|O | 鼠標(biāo)雙擊事件 |
onMouseDown | IE4|N4|O | 鼠標(biāo)上的按鈕被按下了 |
onMouseUp | IE4|N4|O | 鼠標(biāo)按下后,松開時(shí)激發(fā)的事件 |
onMouseOver | IE3|N2|O3 | 當(dāng)鼠標(biāo)移動(dòng)到某對象范圍的上方時(shí)觸發(fā)的事件 |
onMouseMove | IE4|N4|O | 鼠標(biāo)移動(dòng)時(shí)觸發(fā)的事件 |
onMouseOut | IE4|N3|O3 | 當(dāng)鼠標(biāo)離開某對象范圍時(shí)觸發(fā)的事件 |
onKeyPress | IE4|N4|O | 當(dāng)鍵盤上的某個(gè)鍵被按下并且釋放時(shí)觸發(fā)的事件.[注意:頁面內(nèi)必須有被聚焦的對象] |
onKeyDown | IE4|N4|O | 當(dāng)鍵盤上某個(gè)按鍵被按下時(shí)觸發(fā)的事件[注意:頁面內(nèi)必須有被聚焦的對象] |
onKeyUp | IE4|N4|O | 當(dāng)鍵盤上某個(gè)按鍵被按放開時(shí)觸發(fā)的事件[注意:頁面內(nèi)必須有被聚焦的對象] |
事件 | 瀏覽器支持 | 描述 |
onAbort | IE4|N3|O | 圖片在下載時(shí)被用戶中斷 |
onBeforeUnload | IE4|N|O | 當(dāng)前頁面的內(nèi)容將要被改變時(shí)觸發(fā)的事件 |
onError | IE4|N3|O | 捕抓當(dāng)前頁面因?yàn)槟撤N原因而出現(xiàn)的錯(cuò)誤,如腳本錯(cuò)誤與外部數(shù)據(jù)引用的錯(cuò)誤 |
onLoad | IE3|N2|O3 | 頁面內(nèi)空完成傳送到瀏覽器時(shí)觸發(fā)的事件,包括外部文件引入完成 |
onMove | IE|N4|O | 瀏覽器的窗口被移動(dòng)時(shí)觸發(fā)的事件 |
onResize | IE4|N4|O | 當(dāng)瀏覽器的窗口大小被改變時(shí)觸發(fā)的事件 |
onScroll | IE4|N|O | 瀏覽器的滾動(dòng)條位置發(fā)生變化時(shí)觸發(fā)的事件 |
onStop | IE5|N|O | 瀏覽器的停止按鈕被按下時(shí)觸發(fā)的事件或者正在下載的文件被中斷 |
onUnload | IE3|N2|O3 | 當(dāng)前頁面將被改變時(shí)觸發(fā)的事件 |
事件 | 瀏覽器支持 | 描述 |
onBlur | IE3|N2|O3 | 當(dāng)前元素失去焦點(diǎn)時(shí)觸發(fā)的事件 [鼠標(biāo)與鍵盤的觸發(fā)均可] |
onChange | IE3|N2|O3 | 當(dāng)前元素失去焦點(diǎn)并且元素的內(nèi)容發(fā)生改變而觸發(fā)的事件 [鼠標(biāo)與鍵盤的觸發(fā)均可] |
onFocus | IE3|N2|O3 | 當(dāng)某個(gè)元素獲得焦點(diǎn)時(shí)觸發(fā)的事件 |
onReset | IE4|N3|O3 | 當(dāng)表單中RESET的屬性被激發(fā)時(shí)觸發(fā)的事件 |
onSubmit | IE3|N2|O3 | 一個(gè)表單被遞交時(shí)觸發(fā)的事件 |
事件 | 瀏覽器支持 | 描述 |
onBounce | IE4|N|O | 在Marquee內(nèi)的內(nèi)容移動(dòng)至Marquee顯示范圍之外時(shí)觸發(fā)的事件 |
onFinish | IE4|N|O | 當(dāng)Marquee元素完成需要顯示的內(nèi)容后觸發(fā)的事件 |
onStart | IE4|N|O | 當(dāng)Marquee元素開始顯示內(nèi)容時(shí)觸發(fā)的事件 |
事件 | 瀏覽器支持 | 描述 |
onBeforeCopy | IE5|N|O | 當(dāng)頁面當(dāng)前的被選擇內(nèi)容將要復(fù)制到瀏覽者系統(tǒng)的剪貼板前觸發(fā)的事件 |
onBeforeCut | IE5|N|O | 當(dāng)頁面中的一部分或者全部的內(nèi)容將被移離當(dāng)前頁面[剪貼]并移動(dòng)到瀏覽者的系統(tǒng)剪貼板時(shí)觸發(fā)的事件 |
onBeforeEditFocus | IE5|N|O | 當(dāng)前元素將要進(jìn)入編輯狀態(tài) |
onBeforePaste | IE5|N|O | 內(nèi)容將要從瀏覽者的系統(tǒng)剪貼板傳送[粘貼]到頁面中時(shí)觸發(fā)的事件 |
onBeforeUpdate | IE5|N|O | 當(dāng)瀏覽者粘貼系統(tǒng)剪貼板中的內(nèi)容時(shí)通知目標(biāo)對象 |
onContextMenu | IE5|N|O | 當(dāng)瀏覽者按下鼠標(biāo)右鍵出現(xiàn)菜單時(shí)或者通過鍵盤的按鍵觸發(fā)頁面菜單時(shí)觸發(fā)的事件 [試試在頁面中的<body>中加入onContentMenu="return false"就可禁止使用鼠標(biāo)右鍵了] |
onCopy | IE5|N|O | 當(dāng)頁面當(dāng)前的被選擇內(nèi)容被復(fù)制后觸發(fā)的事件 |
onCut | IE5|N|O | 當(dāng)頁面當(dāng)前的被選擇內(nèi)容被剪切時(shí)觸發(fā)的事件 |
onDrag | IE5|N|O | 當(dāng)某個(gè)對象被拖動(dòng)時(shí)觸發(fā)的事件 [活動(dòng)事件] |
onDragDrop | IE|N4|O | 一個(gè)外部對象被鼠標(biāo)拖進(jìn)當(dāng)前窗口或者幀 |
onDragEnd | IE5|N|O | 當(dāng)鼠標(biāo)拖動(dòng)結(jié)束時(shí)觸發(fā)的事件,即鼠標(biāo)的按鈕被釋放了 |
onDragEnter | IE5|N|O | 當(dāng)對象被鼠標(biāo)拖動(dòng)的對象進(jìn)入其容器范圍內(nèi)時(shí)觸發(fā)的事件 |
onDragLeave | IE5|N|O | 當(dāng)對象被鼠標(biāo)拖動(dòng)的對象離開其容器范圍內(nèi)時(shí)觸發(fā)的事件 |
onDragOver | IE5|N|O | 當(dāng)某被拖動(dòng)的對象在另一對象容器范圍內(nèi)拖動(dòng)時(shí)觸發(fā)的事件 |
onDragStart | IE4|N|O | 當(dāng)某對象將被拖動(dòng)時(shí)觸發(fā)的事件 |
onDrop | IE5|N|O | 在一個(gè)拖動(dòng)過程中,釋放鼠標(biāo)鍵時(shí)觸發(fā)的事件 |
onLoseCapture | IE5|N|O | 當(dāng)元素失去鼠標(biāo)移動(dòng)所形成的選擇焦點(diǎn)時(shí)觸發(fā)的事件 |
onPaste | IE5|N|O | 當(dāng)內(nèi)容被粘貼時(shí)觸發(fā)的事件 |
onSelect | IE4|N|O | 當(dāng)文本內(nèi)容被選擇時(shí)的事件 |
onSelectStart | IE4|N|O | 當(dāng)文本內(nèi)容選擇將開始發(fā)生時(shí)觸發(fā)的事件 |
事件 | 瀏覽器支持 | 描述 |
onAfterUpdate | IE4|N|O | 當(dāng)數(shù)據(jù)完成由數(shù)據(jù)源到對象的傳送時(shí)觸發(fā)的事件 |
onCellChange | IE5|N|O | 當(dāng)數(shù)據(jù)來源發(fā)生變化時(shí) |
onDataAvailable | IE4|N|O | 當(dāng)數(shù)據(jù)接收完成時(shí)觸發(fā)事件 |
onDatasetChanged | IE4|N|O | 數(shù)據(jù)在數(shù)據(jù)源發(fā)生變化時(shí)觸發(fā)的事件 |
onDatasetComplete | IE4|N|O | 當(dāng)來子數(shù)據(jù)源的全部有效數(shù)據(jù)讀取完畢時(shí)觸發(fā)的事件 |
onErrorUpdate | IE4|N|O | 當(dāng)使用onBeforeUpdate事件觸發(fā)取消了數(shù)據(jù)傳送時(shí),代替onAfterUpdate事件 |
onRowEnter | IE5|N|O | 當(dāng)前數(shù)據(jù)源的數(shù)據(jù)發(fā)生變化并且有新的有效數(shù)據(jù)時(shí)觸發(fā)的事件 |
onRowExit | IE5|N|O | 當(dāng)前數(shù)據(jù)源的數(shù)據(jù)將要發(fā)生變化時(shí)觸發(fā)的事件 |
onRowsDelete | IE5|N|O | 當(dāng)前數(shù)據(jù)記錄將被刪除時(shí)觸發(fā)的事件 |
onRowsInserted | IE5|N|O | 當(dāng)前數(shù)據(jù)源將要插入新數(shù)據(jù)記錄時(shí)觸發(fā)的事件 |
事件 | 瀏覽器支持 | 描述 |
onAfterPrint | IE5|N|O | 當(dāng)文檔被打印后觸發(fā)的事件 |
onBeforePrint | IE5|N|O | 當(dāng)文檔即將打印時(shí)觸發(fā)的事件 |
onFilterChange | IE4|N|O | 當(dāng)某個(gè)對象的濾鏡效果發(fā)生變化時(shí)觸發(fā)的事件 |
onHelp | IE4|N|O | 當(dāng)瀏覽者按下F1或者瀏覽器的幫助選擇時(shí)觸發(fā)的事件 |
onPropertyChange | IE5|N|O | 當(dāng)對象的屬性之一發(fā)生變化時(shí)觸發(fā)的事件 |
onReadyStateChange | IE4|N|O | 當(dāng)對象的初始化屬性值發(fā)生變化時(shí)觸發(fā)的事件 |
//獲取可見區(qū)域 寬度 高度
availWidth = parseInt(document.body.clientWidth);
availHeight = parseInt(document.body.clientHeight);
可見區(qū)域高度:document.body.clientHeight
總高度:document.body.scrollHeight
可見區(qū)域?qū)挾?document.body.clientWidth
總寬度:document.body.scrollWidth
==============================================================
var getWindowInfo=function()
{
var scrollX=0,scrollY=0,width=0,height=0,contentWidth=0,contentHeight=0;
if(typeof(window.pageXOffset)=='number')
{
scrollX=window.pageXOffset;
scrollY=window.pageYOffset;
}
else if(document.body&&(document.body.scrollLeft||document.body.scrollTop))
{
scrollX=document.body.scrollLeft;
scrollY=document.body.scrollTop;
}
else if(document.documentElement&&(document.documentElement.scrollLeft||document.documentElement.scrollTop))
{
scrollX=document.documentElement.scrollLeft;
scrollY=document.documentElement.scrollTop;
}
if(typeof(window.innerWidth)=='number')
{
width=window.innerWidth;
height=window.innerHeight;
}
else if(document.documentElement&&(document.documentElement.clientWidth||document.documentElement.clientHeight))
{
width=document.documentElement.clientWidth;
height=document.documentElement.clientHeight;
}
else if(document.body&&(document.body.clientWidth||document.body.clientHeight))
{
width=document.body.clientWidth;
height=document.body.clientHeight;
}
if(document.documentElement&&(document.documentElement.scrollHeight||document.documentElement.offsetHeight))
{
if(document.documentElement.scrollHeight>document.documentElement.offsetHeight){
contentWidth=document.documentElement.scrollWidth;
contentHeight=document.documentElement.scrollHeight;
}
else
{
contentWidth=document.documentElement.offsetWidth;
contentHeight=document.documentElement.offsetHeight;
}
}
else if(document.body&&(document.body.scrollHeight||document.body.offsetHeight))
{
if(document.body.scrollHeight>document.body.offsetHeight)
{
contentWidth=document.body.scrollWidth;
contentHeight=document.body.scrollHeight;
}else{
contentWidth=document.body.offsetWidth;
contentHeight=document.body.offsetHeight;
}
}
else
{
contentWidth=width;
contentHeight=height;
}
if(height>contentHeight)
height=contentHeight;
if(width>contentWidth)
width=contentWidth;
var rect=new Object();
rect.ScrollX=scrollX;
rect.ScrollY=scrollY;
rect.Width=width;
rect.Height=height;
rect.ContentWidth=contentWidth;
rect.ContentHeight=contentHeight;
return rect;
}
格式:
<SCRIPT LANGUAGE="javascript">
<!--
window.open('index.htm','title','height=100,width=200,top=0,left=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no')
-->
</SCRIPT>
參數(shù)解釋如下:
'index.htm' 彈出窗口的目標(biāo)文件名
'title' 彈出窗口的標(biāo)題
height 彈出窗口的高度
width 彈出窗口的寬度
top 彈出窗口與屏幕上方的距離
left 彈出窗口與屏幕左側(cè)的距離
toolbar=no 是否顯示工具欄,如果顯示則為yes
menubar=no 是否顯示菜單欄,如果顯示則為yes
scrollbars=no 是否顯示滾動(dòng)條,如果顯示則為yes
location=no 是否顯示地址欄,如果顯示則為yes
status=no 是否顯示狀態(tài)欄,如果顯示則為yes
resizable=no 是否允許改變窗口大小,如果允許則為yes