當(dāng)前位置：首頁(yè) > 前端技术 > javascript >内容正文

javascript

javascript最常用的技巧

發(fā)布時(shí)間：2023/12/20 javascript 28 豆豆

生活随笔收集整理的這篇文章主要介紹了 javascript最常用的技巧小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

http://www.css88.com/archives/96

javascript事件查詢綜合
click() 對(duì)象.click() 使對(duì)象被點(diǎn)擊。
closed 對(duì)象.closed 對(duì)象窗口是否已關(guān)閉true/false
clearTimeout(對(duì)象) 清除已設(shè)置的setTimeout對(duì)象
clearInterval(對(duì)象) 清除已設(shè)置的setInterval對(duì)象
confirm(”提示信息”) 彈出確認(rèn)框，確定返回true取消返回false
cursor:樣式更改鼠標(biāo) 樣式 hand crosshair text wait help default auto e/s/w/n-resize

event.clientX 返回最后一次點(diǎn)擊鼠標(biāo)X坐標(biāo)值；
event.clientY 返回最后一次點(diǎn)擊鼠標(biāo)Y坐標(biāo)值；
event.offsetX 返回當(dāng)前鼠標(biāo)懸停X坐標(biāo)值
event.offsetY 返回當(dāng)前鼠標(biāo)懸停Y坐標(biāo)值

document.write(document.lastModified) 網(wǎng)頁(yè)最后一次更新時(shí)間
document.οndblclick=x 當(dāng)雙擊鼠標(biāo)產(chǎn)生事件
document. 單擊鼠標(biāo)鍵產(chǎn)生事件

document.body.scrollTop; 返回和設(shè)置當(dāng)前豎向滾動(dòng)條的坐標(biāo)值，須與函數(shù)配合,
document.body.scrollLeft; 返回和設(shè)置當(dāng)前橫向滾動(dòng)務(wù)的坐標(biāo)值，須與函數(shù)配合，
document.title document.title=”message”; 當(dāng)前窗口的標(biāo)題欄文字
document.bgcolor document.bgcolor=”顏色值”; 改變窗口背景顏色
document.Fgcolor document.Fgcolor=”顏色值”; 改變正文顏色
document.linkcolor document.linkcolor=”顏色值”; 改變超聯(lián)接顏色
document.alinkcolor document.alinkcolor=”顏色值”; 改變正點(diǎn)擊聯(lián)接的顏色
document.VlinkColor document.VlinkColor=”顏色值”; 改變已訪問(wèn)聯(lián)接的顏色
document.forms.length 返回當(dāng)前頁(yè)form表單數(shù)
document.anchors.length 返回當(dāng)前頁(yè)錨的數(shù)量
document.links.length 返回當(dāng)前頁(yè)聯(lián)接的數(shù)量
document. 單擊鼠標(biāo)觸發(fā)事件
document.οndblclick=x 雙擊鼠標(biāo)觸發(fā)事件
defaultStatus window.status=defaultStatus; 將狀態(tài)欄設(shè)置默認(rèn)顯示

function function xx(){…} 定義函數(shù)
isNumeric 判斷是否是數(shù)字
innerHTML xx=對(duì)象.innerHTML 輸入某對(duì)象標(biāo)簽中的html源代碼
innerText divid.innerText=xx 將以div定位以id命名的對(duì)象值設(shè)為XX

location.reload(); 使本頁(yè)刷新，target可等于一個(gè)刷新的網(wǎng)頁(yè)

Math.random() 隨機(jī)涵數(shù),只能是0到1之間的數(shù),如果要得到其它數(shù),可以為*10,再取整
Math.floor(number) 將對(duì)象number轉(zhuǎn)為整數(shù)，舍取所有小數(shù)
Math.min(1,2) 返回1,2哪個(gè)小
Math.max(1,2) 返回1,2哪個(gè)大

navigator.appName 返回當(dāng)前瀏覽器名稱
navigator.appVersion 返回當(dāng)前瀏覽器版本號(hào)
navigator.appCodeName 返回當(dāng)前瀏覽器代碼名字
navigator.userAgent 返回當(dāng)前瀏覽器用戶代標(biāo)志

onsubmit οnsubmit=”return(xx())” 使用函數(shù)返回值
opener opener.document.對(duì)象控制原打開(kāi)窗體對(duì)象

prompt xx=window.prompt(”提示信息”,”預(yù)定值”); 輸入語(yǔ)句
parent parent.框架名.對(duì)象控制框架頁(yè)面

return return false 返回值
random 隨機(jī)參數(shù)（0至1之間）
reset() form.reset(); 使form表單內(nèi)的數(shù)據(jù)重置

split(””) string.split(””) 將string對(duì)象字符以逗號(hào)隔開(kāi)
submit() form對(duì)象.submit() 使form對(duì)象提交數(shù)據(jù)

String對(duì)象的 charAt(x)對(duì)象反回指定對(duì)象的第多少位的字母
lastIndexOf(”string”) 從右到左詢找指定字符，沒(méi)有返回-1
indexOf(”string”) 從左到右詢找指定字符，沒(méi)有返回-1
LowerCase() 將對(duì)象全部轉(zhuǎn)為小寫
UpperCase() 將對(duì)象全部轉(zhuǎn)為大寫
substring(0,5) string.substring(x,x) 返回對(duì)象中從0到5的字符
setTimeout(”function”,time) 設(shè)置一個(gè)超時(shí)對(duì)象
setInterval(”function”,time) 設(shè)置一個(gè)超時(shí)對(duì)象

toLocaleString() x.toLocaleString() 從x時(shí)間對(duì)象中獲得時(shí)間，以字符串型式存在
typeof(變量名) 檢查變量的類型，值有：String,Boolean,Object,Function,Underfined

window.event.button==1/2/3 鼠標(biāo)鍵左鍵等于1右鍵等于2兩個(gè)鍵一起按為3
window.screen.availWidth 返回當(dāng)前屏幕寬度(空白空間)
window.screen.availHeight 返回當(dāng)前屏幕高度(空白空間)
window.screen.width 返回當(dāng)前屏幕寬度(分辨率值)
window.screen.height 返回當(dāng)前屏幕高度(分辨率值)
window.document.body.offsetHeight; 返回當(dāng)前網(wǎng)頁(yè)高度
window.document.body.offsetWidth; 返回當(dāng)前網(wǎng)頁(yè)寬度
window.resizeTo(0,0) 將窗口設(shè)置寬高
window.moveTo(0,0) 將窗口移到某位置
window.focus() 使當(dāng)前窗口獲得焦點(diǎn)
window.scroll(x,y) 窗口滾動(dòng)條坐標(biāo)，y控制上下移動(dòng)，須與函數(shù)配合
window.open() window.open(”地址”,”名稱”,”屬性”)
屬性:toolbar(工具欄),location(地址欄),directions,status(狀態(tài)欄),
menubar(菜單欄),scrollbar(滾動(dòng)條),resizable(改變大小), width(寬),height(高),fullscreen(全屏),scrollbars(全屏?xí)r無(wú)滾動(dòng)條無(wú)參數(shù),channelmode(寬屏),left(打開(kāi)窗口x坐標(biāo)),top(打開(kāi)窗口y坐標(biāo))
window.location = ‘view-source:’ + window.location.href 應(yīng)用事件查看網(wǎng)頁(yè)源代碼;

a=new Date(); //創(chuàng)建a為一個(gè)新的時(shí)期對(duì)象
y=a.getYear(); //y的值為從對(duì)象a中獲得年份值兩位數(shù)年份
y1=a.getFullYear(); //獲取全年份數(shù) 四位數(shù)年份
m=a.getMonth(); //獲取月份值
d=a.getDate(); //獲取日期值
d1=a.getDay(); //獲取當(dāng)前星期值
h=a.getHours(); //獲取當(dāng)前小時(shí)數(shù)
m1=a.getMinutes(); //獲取當(dāng)前分鐘數(shù)
s=a.getSeconds(); //獲取當(dāng)前秒鐘數(shù)

對(duì)象.style.fontSize=”文字大小”;
單位：mm/cm/in英寸/pc帕/pt點(diǎn)/px象素/em文字高
1in=1.25cm
1pc=12pt
1pt=1.2px(800*600分辯率下)

文本字體屬性：
fontSize大小
family字體
color顏色
fontStyle風(fēng)格，取值為normal一般,italic斜體,oblique斜體且加粗
fontWeight加粗,取值為100到900不等,900最粗,light,normal,bold
letterSpacing間距,更改文字間距離,取值為,1pt,10px,1cm
textDecoration:文字修飾;取值,none不修飾,underline下劃線,overline上劃線
background:文字背景顏色,
backgroundImage:背景圖片,取值為圖片的插入路徑

點(diǎn)擊網(wǎng)頁(yè)正文函數(shù)調(diào)用觸發(fā)器：

1.onClick 當(dāng)對(duì)象被點(diǎn)擊
2.onLoad 當(dāng)網(wǎng)頁(yè)打開(kāi),只能書(shū)寫在body中
3.onUnload 當(dāng)網(wǎng)頁(yè)關(guān)閉或離開(kāi)時(shí),只能書(shū)寫在body中
4. 當(dāng)鼠標(biāo)懸于其上時(shí)
5. 當(dāng)鼠標(biāo)離開(kāi)對(duì)象時(shí)
6. 當(dāng)鼠標(biāo)松開(kāi)
7. 當(dāng)鼠標(biāo)按下鍵
8.onFocus 當(dāng)對(duì)象獲取焦點(diǎn)時(shí)
9.onSelect 當(dāng)對(duì)象的文本被選中時(shí)
10.onChange 當(dāng)對(duì)象的內(nèi)容被改變
11.onBlur 當(dāng)對(duì)象失去焦點(diǎn)
οnsubmit=return(ss())表單調(diào)用時(shí)返回的值

直線 border-bottom:1x solid black
虛線 border-bottom:1x dotted black
點(diǎn)劃線 border-bottom:2x dashed black
雙線 border-bottom:5x double black
槽狀 border-bottom:1x groove black
脊?fàn)?border-bottom:1x ridge black

1.邊緣高光glow(color=顏色,strength=亮光大小)

2.水平翻轉(zhuǎn)fliph() 使對(duì)象水平翻轉(zhuǎn)180度

3.垂直翻轉(zhuǎn)flipv() 使對(duì)象垂直翻轉(zhuǎn)180度

4.對(duì)象模糊blur(add=true/false direction=方向 strength=強(qiáng)度)
add指定是否按印象畫派進(jìn)行模糊direction模糊方向strength模糊強(qiáng)度
5.對(duì)象透明alpha(opaction=0-100,finishopacity=0-100,style=0/1/2/3)
opaction對(duì)象整體不透明值finishopacity當(dāng)對(duì)象利用了漸透明時(shí)該項(xiàng)指定結(jié)束透明位置的不透明值style指定透明方式0為整體透明，1為線型透明，2為圓型透明，3為矩形透明
6.去除顏色chroma(color=顏色值)使對(duì)象中顏色與指定顏色相同區(qū)域透明
7.建立陰影dropshadow(color=陰影顏色,offx=水平向左偏離像素,offy=水平向下偏離像素)
8.去色gray()使對(duì)象呈灰度顯示
9.負(fù)片效果invert()使對(duì)象呈底片效果
10.高光light()使對(duì)象呈黑色顯示
11.遮蓋mask(color=顏色)使整個(gè)對(duì)象以指定顏色進(jìn)行蒙板一次

opacity 表透明度水平.0~100,0表全透明,100表完全不透明
finishopacity表想要設(shè)置的漸變透明效果.0~100.
style 表透明區(qū)的形狀.0表統(tǒng)一形狀.1表線形.2表放射形.3表長(zhǎng)方形.
startx.starty表漸變透明效果的開(kāi)始時(shí)X和Y坐標(biāo).
finishx,finishy漸變透明效果結(jié)束時(shí)x,y 的坐標(biāo).
add有來(lái)確定是否在模糊效果中使有原有目標(biāo).值為0,1.0表”否”,1表”是”.
direction設(shè)置模糊的方向.0度表垂直向上,45度為一個(gè)單位.默認(rèn)值是向左270度.left,right,down,up.
strength 只能用整數(shù)來(lái)確定.代表有多少個(gè)像素的寬度將受到模糊影響.默認(rèn)是5個(gè).
color要透明的顏色.
offx,offy分別是x,y 方向陰影的偏移量.
positive指投影方式.0表透明像素生成陰影.1表只給出不透明像素生成陰影..

AddAmbient:加入包圍的光源.
AddCone:加入錐形光源.
AddPoint加入點(diǎn)光源
Changcolor:改變光的顏色．
Changstrength:改變光源的強(qiáng)度．
Clear:清除所有的光源．
MoveLight:移動(dòng)光源．

freq是波紋的頻率，在指定在對(duì)象上一區(qū)需要產(chǎn)生多少個(gè)完事的波紋．
lightstrength可對(duì)于波紋增強(qiáng)光影的效果．顯著0~100正整數(shù)，正弦波開(kāi)始位置是0~360度．0表從0度開(kāi)始，25表從90度開(kāi)始．
strength表振幅大小．

hand style=”cursor:hand”
crosshair style=”cursor:crosshair”
text style=”cursor:text”
wait style=”cursor:wait”
default style=”cursor:default”
help style=”cursor:help”
e-resize style=”cursor:e-resize”
ne-resize style=”cursor:ne-resize”
n-resize style=”cursor:n-resize”
nw-resize style=”cursor:nw-resize”
w-resize style=”cursor:w-resize”
s-resize style=”cursor:s-resize”
sw-resize style=”cursor:sw-resize ”
se-resize style=”cursor:se-resize”
auto style=”cursor:auto”

Javascript小技巧
? 事件源對(duì)象
? event.srcElement.tagName
? event.srcElement.type
? 捕獲釋放
? event.srcElement.setCapture();?
? event.srcElement.releaseCapture();?
? 事件按鍵
? event.keyCode
? event.shiftKey
? event.altKey
? event.ctrlKey
? 事件返回值
? event.returnValue
? 鼠標(biāo)位置
? event.x
? event.y
? 窗體活動(dòng)元素
? document.activeElement
? 綁定事件
? document.captureEvents(Event.KEYDOWN);
? 訪問(wèn)窗體元素
? document.all(“txt”).focus();
? document.all(“txt”).select();
? 窗體命令
? document.execCommand
? 窗體COOKIE
? document.cookie
? 菜單事件
? document.oncontextmenu
? 創(chuàng)建元素
? document.createElement(“SPAN”);?
? 根據(jù)鼠標(biāo)獲得元素：
? document.elementFromPoint(event.x,event.y).tagName==”TD
? document.elementFromPoint(event.x,event.y).appendChild(ms)?
? 窗體圖片
? document.p_w_picpaths[索引]
? 窗體事件綁定
? document.οnmοusedοwn=scrollwindow;
? 元素
? document.窗體.elements[索引]
? 對(duì)象綁定事件
? document.all.xxx.detachEvent(‘onclick’,a);
? 插件數(shù)目
? navigator.plugins
? 取變量類型
? typeof($js_libpath) == “undefined”
? 下拉框
? 下拉框.options[索引]
? 下拉框.options.length
? 查找對(duì)象
? document.getElementsByName(“r1″);
? document.getElementById(id);
? 定時(shí)
? timer=setInterval(‘scrollwindow()’,delay);
? clearInterval(timer);
? UNCODE編碼
? escape() ,unescape
? 父對(duì)象
? obj.parentElement(dhtml)
? obj.parentNode(dom)
? 交換表的行
? TableID.moveRow(2,1)
? 替換CSS
? document.all.csss.href = “a.css”;
? 并排顯示
? display:inline
? 隱藏焦點(diǎn)
? hidefocus=true
? 根據(jù)寬度換行
? style=”word-break:break-all”
? 自動(dòng)刷新
? <meta HTTP-EQUIV=”refresh” CONTENT=”8;URL=http://c98.yeah.net”>
? 簡(jiǎn)單郵件
? <a? href=”mailto:aaa@bbb.com?subject=ccc&body=xxxyyy“>?
? 快速轉(zhuǎn)到位置
? obj.scrollIntoView(true)
? 錨
? <a name=”first”>
? <a href=”#first”>anchors</a>
? 網(wǎng)頁(yè)傳遞參數(shù)
? location.search();
? 可編輯
? obj.contenteditable=true
? 執(zhí)行菜單命令
? obj.execCommand
? 雙字節(jié)字符
? /[^\x00-\xff]/
? 漢字
? /[\u4e00-\u9fa5]/
? 讓英文字符串超出表格寬度自動(dòng)換行
? word-wrap: break-word; word-break: break-all;
? 透明背景
? <IFRAME src=”1.htm” width=300 height=180 allowtransparency></iframe>
? 獲得style內(nèi)容
? obj.style.cssText
? HTML標(biāo)簽
? document.documentElement.innerHTML
? 第一個(gè)style標(biāo)簽
? document.styleSheets[0]
? style標(biāo)簽里的第一個(gè)樣式
? document.styleSheets[0].rules[0]
? 防止點(diǎn)擊空鏈接時(shí)，頁(yè)面往往重置到頁(yè)首端。
? <a href=”javascript :function()”>word</a>
? 上一網(wǎng)頁(yè)源
? asp:
? request.servervariables(“HTTP_REFERER”)
? javascript :
? document.referrer
? 釋放內(nèi)存
? CollectGarbage();
? 禁止右鍵
? document.oncontextmenu = function() { return false;}
? 禁止保存
? <noscript><iframe src=”*.htm”></iframe></noscript>
? 禁止選取<body οncοntextmenu=”return false” οndragstart=”return false”
? onselectstart =”return false” οnselect=”document.selection.empty()”
? οncοpy=”document.selection.empty()” onbeforecopy=”return
? false”οnmοuseup=”document.selection.empty()>?
? 禁止粘貼
? <input type=text οnpaste=”return false”>
? 地址欄圖標(biāo)
? <link rel=”Shortcut Icon” href=”favicon.ico”>
? favicon.ico 名字最好不變16*16的16色,放虛擬目錄根目錄下
? 收藏欄圖標(biāo)
? <link rel=”Bookmark” href=”favicon.ico”>
? 查看源碼
? <input type=button value=查看網(wǎng)頁(yè)源代碼 οnclick=”window.location = ‘view-source:’+
? ‘http://www.csdn.net/’”>
? 關(guān)閉輸入法
? <input style=”ime-mode:disabled”>
? 自動(dòng)全選
? <input type=text name=text1 value=”123″ οnfοcus=”this.select()”>
? ENTER鍵可以讓光標(biāo)移到下一個(gè)輸入框
? <input οnkeydοwn=”if(event.keyCode==13)event.keyCode=9″>
? 文本框的默認(rèn)值
? <input type=text value=”123″ οnfοcus=”alert(this.defaultValue)”>
? title換行
? obj.title = “123&#13sdfs&#32″
? 獲得時(shí)間所代表的微秒
? var n1 = new Date(“2004-10-10″.replace(/-/g, “\/”)).getTime()
? 窗口是否關(guān)閉
? win.closed
? checkbox扁平
? <input type=checkbox style=”position: absolute; clip:rect(5px 15px 15px
? 5px)”><br>
? 獲取選中內(nèi)容
? document.selection.createRange().duplicate().text
? 自動(dòng)完成功能
? <input? type=text? autocomplete=on>打開(kāi)該功能?
? <input? type=text? autocomplete=off>關(guān)閉該功能???
? 窗口最大化
? <body οnlοad=”window.resizeTo(window.screen.width -
? 4,window.screen.height-50);window.moveTo(-4,-4)”>
? 無(wú)關(guān)閉按鈕IE
? window.open(“aa.htm”, “meizz”, “fullscreen=7″);
? 統(tǒng)一編碼/解碼
? alert(decodeURIComponent(encodeURIComponent(“http://你好.com?as= hehe”)))
? encodeURIComponent對(duì)”:”、”/”、”;” 和 “?”也編碼
? 表格行指示
? <tr οnmοuseοver=”this.bgColor=’#f0f0f0′” οnmοuseοut=”this.bgColor=’#ffffff’”>

? //各種尺寸
? s? +=? “\r\n網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)?#xff1a;”+? document.body.clientWidth;??
? s? +=? “\r\n網(wǎng)頁(yè)可見(jiàn)區(qū)域高：”+? document.body.clientHeight;??
? s? +=? “\r\n網(wǎng)頁(yè)可見(jiàn)區(qū)域高：”+? document.body.offsetWeight? +”? (包括邊線的寬)”;??
? s? +=? “\r\n網(wǎng)頁(yè)可見(jiàn)區(qū)域高：”+? document.body.offsetHeight? +”? (包括邊線的寬)”;??
? s? +=? “\r\n網(wǎng)頁(yè)正文全文寬：”+? document.body.scrollWidth;??
? s? +=? “\r\n網(wǎng)頁(yè)正文全文高：”+? document.body.scrollHeight;??
? s? +=? “\r\n網(wǎng)頁(yè)被卷去的高：”+? document.body.scrollTop;??
? s? +=? “\r\n網(wǎng)頁(yè)被卷去的左：”+? document.body.scrollLeft;??
? s? +=? “\r\n網(wǎng)頁(yè)正文部分上：”+? window.screenTop;??
? s? +=? “\r\n網(wǎng)頁(yè)正文部分左：”+? window.screenLeft;??
? s? +=? “\r\n屏幕分辨率的高：”+? window.screen.height;??
? s? +=? “\r\n屏幕分辨率的寬：”+? window.screen.width;??
? s? +=? “\r\n屏幕可用工作區(qū)高度：”+? window.screen.availHeight;??
? s? +=? “\r\n屏幕可用工作區(qū)寬度：”+? window.screen.availWidth;??
//過(guò)濾數(shù)字
<input type=text οnkeypress=”return
event.keyCode>=48&&event.keyCode<=57||(this.value.indexOf(‘.’)<0?event.keyCode==46:false)”
οnpaste=”return !clipboardData.getData(‘text’).match(/\D/)” οndragenter=”return
false”>
//特殊用途
<input type=button value=導(dǎo)入收藏夾
οnclick=”window.external.ImportExportFavorites(true,’http://localhost’);”>
<input type=button value=導(dǎo)出收藏夾
οnclick=”window.external.ImportExportFavorites(false,’http://localhost’);”>
<input type=button value=整理收藏夾
οnclick=”window.external.ShowBrowserUI(‘OrganizeFavorites’, null)”>
<input type=button value=語(yǔ)言設(shè)置??
οnclick=”window.external.ShowBrowserUI(‘LanguageDialog’, null)”>
<input type=button value=加入收藏夾
οnclick=”window.external.AddFavorite(‘http://www.google.com/’, ‘google’)”>
<input type=button value=加入到頻道
οnclick=”window.external.addChannel(‘http://www.google.com/’)”>
<input type=button value=加入到頻道
οnclick=”window.external.showBrowserUI(‘PrivacySettings’,null)”>
//不緩存
<META HTTP-EQUIV=”pragma” CONTENT=”no-cache”>
<META HTTP-EQUIV=”Cache-Control” CONTENT=”no-cache, must-revalidate”>
<META HTTP-EQUIV=”expires” CONTENT=”0″>

//正則匹配
匹配中文字符的正則表達(dá)式： [\u4e00-\u9fa5]
匹配雙字節(jié)字符(包括漢字在內(nèi))：[^\x00-\xff]
匹配空行的正則表達(dá)式：\n[\s| ]*\r
匹配HTML標(biāo)記的正則表達(dá)式：/<(.*)>.*<\/\1>|<(.*) \/>/?
匹配首尾空格的正則表達(dá)式：(^\s*)|(\s*$)（像vbscript那樣的trim函數(shù)）
匹配Email地址的正則表達(dá)式：\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*
匹配網(wǎng)址URL的正則表達(dá)式：http://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?
以下是例子：
利用正則表達(dá)式限制網(wǎng)頁(yè)表單里的文本框輸入內(nèi)容：
用正則表達(dá)式限制只能輸入中文：οnkeyup=”value=value.replace(/[^\u4E00-\u9FA5]/g,”)”
onbeforepaste=”clipboardData.setData(‘text’,clipboardData.getData(‘text’).replace(/[^\u4E00-\u9FA5]/g,”))”

1.用正則表達(dá)式限制只能輸入全角字符： οnkeyup=”value=value.replace(/[^\uFF00-\uFFFF]/g,”)”
onbeforepaste=”clipboardData.setData(‘text’,clipboardData.getData(‘text’).replace(/[^\uFF00-\uFFFF]/g,”))”

2.用正則表達(dá)式限制只能輸入數(shù)字：οnkeyup=”value=value.replace(/[^\d]/g,”)
“onbeforepaste=”clipboardData.setData(‘text’,clipboardData.getData(‘text’).replace(/[^\d]/g,”))”

3.用正則表達(dá)式限制只能輸入數(shù)字和英文：οnkeyup=”value=value.replace(/[\W]/g,”)
“onbeforepaste=”clipboardData.setData(‘text’,clipboardData.getData(‘text’).replace(/[^\d]/g,”))”

//消除圖像工具欄
<IMG SRC=”mypicture.jpg” HEIGHT=”100px” WIDTH=”100px” GALLERYIMG=”false”>?
or
<head>
<meta http-equiv=”p_w_picpathtoolbar” content=”no”>
</head>
//無(wú)提示關(guān)閉

進(jìn)入頁(yè)面<meta http-equiv=”Page-Enter” content=”revealTrans(duration=x,
transition=y)”>
推出頁(yè)面<meta http-equiv=”Page-Exit” content=”revealTrans(duration=x,
transition=y)”>?
這個(gè)是頁(yè)面被載入和調(diào)出時(shí)的一些特效。duration表示特效的持續(xù)時(shí)間，以秒為單位。transition表示使
用哪種特效，取值為1-23:
　　0 矩形縮小?
　　1 矩形擴(kuò)大?
　　2 圓形縮小
　　3 圓形擴(kuò)大?
　　4 下到上刷新?
　　5 上到下刷新
　　6 左到右刷新?
　　7 右到左刷新?
　　8 豎百葉窗
　　9 橫百葉窗?
　　10 錯(cuò)位橫百葉窗?
　　11 錯(cuò)位豎百葉窗
　　12 點(diǎn)擴(kuò)散?
　　13 左右到中間刷新?
　　14 中間到左右刷新
　　15 中間到上下
　　16 上下到中間?
　　17 右下到左上
　　18 右上到左下?
　　19 左上到右下?
　　20 左下到右上
　　21 橫條?
　　22 豎條?
　　23?
//網(wǎng)頁(yè)是否被檢索
<meta name=”ROBOTS” content=”屬性值”>
　　其中屬性值有以下一些:
　　屬性值為”all”: 文件將被檢索，且頁(yè)上鏈接可被查詢；
　　屬性值為”none”: 文件不被檢索，而且不查詢頁(yè)上的鏈接；
　　屬性值為”index”: 文件將被檢索；
　　屬性值為”follow”: 查詢頁(yè)上的鏈接；
　　屬性值為”noindex”: 文件不檢索，但可被查詢鏈接；
　　屬性值為”nofollow”:?

//打印分頁(yè)
<p? style=”page-break-after:always”>page1</p>??
<p? style=”page-break-after:always”>page2</p>??

//設(shè)置打印

function checkBrowser()
{?
?? this.ver=navigator.appVersion?
?? this.dom=document.getElementById?1:0?
?? this.ie6=(this.ver.indexOf(“MSIE 6″)>-1 && this.dom)?1:0;?
?? this.ie5=(this.ver.indexOf(“MSIE 5″)>-1 && this.dom)?1:0;?
?? this.ie4=(document.all && !this.dom)?1:0;?
?? this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;?
?? this.ns4=(document.layers && !this.dom)?1:0;?
?? this.mac=(this.ver.indexOf(‘Mac’) > -1) ?1:0;?
?? this.ope=(navigator.userAgent.indexOf(‘Opera’)>-1);?
?? this.ie=(this.ie6 || this.ie5 || this.ie4)?
?? this.ns=(this.ns4 || this.ns5)?
?? this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns5 || this.ns4 || this.mac
|| this.ope)?
?? this.nbw=(!this.bw)?
?? return this;
}
//計(jì)算內(nèi)容寬和高
<SCRIPT? language=”javascript”>??
function? test(obj)??
{??
?????? var? range? =? obj.createTextRange();??
?????? alert(“內(nèi)容區(qū)寬度:? “? +? range.boundingWidth????
???????????????????????????????????????????????? +? “px\r\n內(nèi)容區(qū)高度:? “? +?
range.boundingHeight? +? “px”);??
?????????????
}??
</SCRIPT>??
<BODY>??
<Textarea id=”txt” height=”150″>sdf</textarea><INPUT? type=”button”?
value=”計(jì)算內(nèi)容寬度”? onClick=”test(txt)”>??
</BODY>
//無(wú)模式的提示框
function modelessAlert(Msg)
{
??
window.showModelessDialog(“javascript :alert(\”"+escape(Msg)+”\”);window.close();”,”",”status:no;resizable:no;help:no;dialogHeight:height:30px;dialogHeight:40px;”);

}
//屏蔽按鍵
<html>
<head>
? <meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″>
? <noscript><meta http-equiv=”refresh”
content=”0;url=about:noscript”></noscript>
? <title>屏蔽鼠標(biāo)右鍵、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格鍵</title>
</head>
<body>
<script language=”Javascript”><!–
? //屏蔽鼠標(biāo)右鍵、Ctrl+N、Shift+F10、F11、F5刷新、退格鍵
? //Author: meizz(梅花雨) 2002-6-18
function document.oncontextmenu(){event.returnValue=false;}//屏蔽鼠標(biāo)右鍵
function window.onhelp(){return false} //屏蔽F1幫助
function document.onkeydown()
{
? if ((window.event.altKey)&&
????? ((window.event.keyCode==37)||?? //屏蔽 Alt+ 方向鍵 ←
?????? (window.event.keyCode==39)))?? //屏蔽 Alt+ 方向鍵 →
? {
???? alert(“不準(zhǔn)你使用ALT+方向鍵前進(jìn)或后退網(wǎng)頁(yè)！”);
???? event.returnValue=false;
? }
???? /* 注：這還不是真正地屏蔽 Alt+ 方向鍵，
???? 因?yàn)?Alt+ 方向鍵彈出警告框時(shí)，按住 Alt 鍵不放，
???? 用鼠標(biāo)點(diǎn)掉警告框，這種屏蔽方法就失效了。以后若
???? 有哪位高手有真正屏蔽 Alt 鍵的方法，請(qǐng)告知。*/
? if ((event.keyCode==8)? ||???????????????? //屏蔽退格刪除鍵
????? (event.keyCode==116)||???????????????? //屏蔽 F5 刷新鍵
????? (event.ctrlKey && event.keyCode==82)){ //Ctrl + R
???? event.keyCode=0;
???? event.returnValue=false;
???? }
? if (event.keyCode==122){event.keyCode=0;event.returnValue=false;}? //屏蔽F11
? if (event.ctrlKey && event.keyCode==78) event.returnValue=false;?? //屏蔽 Ctrl+n

? if (event.shiftKey && event.keyCode==121)event.returnValue=false;? //屏蔽
shift+F10
? if (window.event.srcElement.tagName == “A” && window.event.shiftKey)?
????? window.event.returnValue = false;???????????? //屏蔽 shift 加鼠標(biāo)左鍵新開(kāi)一網(wǎng)頁(yè)
? if ((window.event.altKey)&&(window.event.keyCode==115))???????????? //屏蔽Alt+F4

? {
?????
window.showModelessDialog(“about:blank”,”",”dialogWidth:1px;dialogheight:1px”);
????? return false;
? }
}
</script>
屏蔽鼠標(biāo)右鍵、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格鍵
</body>
</html>
//屏蔽打印
<style>
@media print{
* {display:none}
}
</style>
//移動(dòng)的圖層，拖動(dòng)

1.<span style=’position:absolute;width:200;height:200;background:red’
οnmοusemοve=MouseMove()
οnmοuseup=MouseUp()>meizz</span>
<script language=javascript>
var Obj;
function MouseDown(obj)
{
? obj=obj;
? Obj.setCapture();
? Obj.l=event.x-Obj.style.pixelLeft;
? Obj.t=event.y-Obj.style.pixelTop;
}
function MouseMove()
{
? if(Obj!=null)
? {
??? Obj.style.left = event.x-Obj.l;
??? Obj.style.top = event.y-Obj.t;
? }
}
function MouseUp()
{
? if(Obj!=null)
? {
??? Obj.releaseCapture();
??? obj=null;
? }
}
</script>
2.
<div id=”myDiv” src=”logo.gif” οndrag=”doDrag();”
οnmοuseοver=”this.style.cursor=’hand’”
style=”position:absolute;left=100;top=100;” οnmοusedοwn=”doMouseDown();”>
<a href=”#” false”><h1>wlecome</h1></a>
</div>
<script language=”JavaScript” type=”text/javascript”>
var orgMouseX;
var orgMouseY;
var orgObjX;
var orgObjY;
function doDrag()
{
var myObject=document.all.myDiv;

var x=event.clientX;
var y=event.clientY;
myObject.style.left=x-(orgMouseX-orgObjX);
myObject.style.top=y-(orgMouseY-orgObjY);
?
}
function doMouseDown()
{
orgMouseX=event.clientX;
orgMouseY=event.clientY;
orgObjX=parseInt(document.all.myDiv.style.left);
orgObjY=parseInt(document.all.myDiv.style.top);
}

</script>
?
//文檔狀態(tài)改變

//刷新后不變的文本框
<HTML>
<HEAD>
<META NAME=”save” CONTENT=”history”>
<STYLE>
?? .sHistory {behavior:url(#default#savehistory);}
</STYLE>
</HEAD>
<BODY>
<INPUT class=sHistory type=text id=oPersistInput>
</BODY>
</HTML>
//訪問(wèn)剪貼板
(1)拖拽訪問(wèn)
event.dataTransfer.setData(“URL”, oImage.src);
sImageURL = event.dataTransfer.getData(“URL”)
(2)普通訪問(wèn)
window.clipboardData.setData(“Text”,oSource.innerText);
window.clipboardData.getData(“Text”);
//操作COOKIE

//自定義的apply,call
Function.prototype.apply = function (obj, argu) {
?if (obj) obj.constructor.prototype._caller = this;?
?var argus = new Array();
?for (var i=0;i<argu.length;i++)
? argus[i] = “argu[" + i + "]“;
?var r;
?eval(“r = ” + (obj ? (“obj._caller(” + argus.join(“,”) + “);”) : (“this(” +
argus.join(“,”) + “);”)));
?return r;
};
Function.prototype.call = function (obj) {
?var argu = new Array();
?for (var i=1;i<arguments.length;i++)
? argu[i-1] = arguments[i];
?return this.apply(obj, argu);
};???????

//下載文件
function DownURL(strRemoteURL,strLocalURL)
{
?try
?{
? var xmlHTTP=new ActiveXObject(“Microsoft.XMLHTTP”);
? xmlHTTP.open(“Get”,strRemoteURL,false);
? xmlHTTP.send();
? var adodbStream=new ActiveXObject(“ADODB.Stream”);
? adodbStream.Type=1;//1=adTypeBinary
? adodbStream.Open();
? adodbStream.write(xmlHTTP.responseBody);
? adodbStream.SaveToFile(strLocalURL,2);
? adodbStream.Close();
? adodbStream=null;
? xmlHTTP=null;
??
?}
?catch(e)
?{
? window.confirm(“下載URL出錯(cuò)!”);
?}
?//window.confirm(“下載完成.”);
}

//檢驗(yàn)連接是否有效
function getXML(URL)?
{
?var xmlhttp = new ActiveXObject(“microsoft.xmlhttp”);
?xmlhttp.Open(“GET”,URL, false);?
?try
?{?
? xmlhttp.Send();
?}
?catch(e){}
?finally?
?{
? var result = xmlhttp.responseText;
? if(result)?
? {
?? if(xmlhttp.Status==200)
?? {
??? return(true);
?? }
?? else?
?? {
??? return(false);
?? }
? }
? else?
? {
?? return(false);
? }
?}
}
//POST代替FORM
<SCRIPT language=”VBScript”>
Function URLEncoding(vstrIn)
??? strReturn = “”
??? For i = 1 To Len(vstrIn)
??????? ThisChr = Mid(vStrIn,i,1)
??????? If Abs(Asc(ThisChr)) < &HFF Then
??????????? strReturn = strReturn & ThisChr
??????? Else
??????????? innerCode = Asc(ThisChr)
??????????? If innerCode < 0 Then
??????????????? innerCode = innerCode + &H10000
??????????? End If
??????????? Hight8 = (innerCode? And &HFF00)\ &HFF
??????????? Low8 = innerCode And &HFF
??????????? strReturn = strReturn & “%” & Hex(Hight8) &? “%” & Hex(Low8)
??????? End If
??? Next
??? URLEncoding = strReturn
End Function
Function bytes2BSTR(vIn)
??? strReturn = “”
??? For i = 1 To LenB(vIn)
??????? ThisCharCode = AscB(MidB(vIn,i,1))
??????? If ThisCharCode < &H80 Then
??????????? strReturn = strReturn & Chr(ThisCharCode)
??????? Else
??????????? NextCharCode = AscB(MidB(vIn,i+1,1))
??????????? strReturn = strReturn & Chr(CLng(ThisCharCode) * &H100 +
CInt(NextCharCode))
??????????? i = i + 1
??????? End If
??? Next
??? bytes2BSTR = strReturn
End Function
dim strA,oReq
strA = URLEncoding(“submit1=Submit&text1=中文”)
set oreq = CreateObject(“MSXML2.XMLHTTP”)
oReq.open “POST”,”http://ServerName/VDir/TstResult.asp”,false
oReq.setRequestHeader “Content-Length”,Len(strA)
oReq.setRequestHeader “CONTENT-TYPE”,”application/x-www-form-urlencoded”
oReq.send strA
msgbox bytes2BSTR(oReq.responseBody)
</SCRIPT>
//readyState是xmlhttp返回?cái)?shù)據(jù)的進(jìn)度，0=載入中,1=未初始化,2=已載入,3=運(yùn)行中,4=完成
//組件是否安裝
isComponentInstalled(“{6B053A4B-A7EC-4D3D-4567-B8FF8A1A5739}”, “componentID”))
//檢查網(wǎng)頁(yè)是否存在

<html>
<body>
srno：<input type=text datasrc=#xmldate DataFLD=srno size=”76″><BR>
times：<input type=text datasrc=#xmldate DataFLD=times size=”76″><BR>
<input id=”first” TYPE=button value=”<<　第一條記錄”
οnclick=”xmldate.recordset.moveFirst()”>
<input id=”prev” TYPE=button value=”<上一條記錄”
οnclick=”xmldate.recordset.movePrevious()”>??
<input id=”next” TYPE=button value=”下一條記錄>”
οnclick=”xmldate.recordset.moveNext()”>??
<input id=”last” TYPE=button value=”最后一條記錄>>”
οnclick=”xmldate.recordset.moveLast()”>???
<input id=”Add” TYPE=button value=”添加新記錄” οnclick=”xmldate.recordset.addNew()”>?
?

<XML ID=”xmldate”>
<infolist>
<info ><srno>20041025-01</srno><times>null</times></info>
<info ><srno>20041101-09</srno><times>2004年10月1日2點(diǎn)22分0秒</times></info>
</infolist>
</XML>
</body>
</html>
//獲得參數(shù)
<body>
<a href=”javascript :location.href=location.href + ‘?a=1&b=2′”>search</a>
<script language=”JavaScript”>
<!–
var a = location.search.substr(1);
if(a.length>0)
{
?var re = /([^&]*?)\=([^&]*)/g
?var s = a.match(re);
?for(var i= 0;i<s.length;i++)
?{
? alert(s[i]);
? alert(s[i].split(“=”)[1]);
?}
}
//–>
</script>
</body>
//可編輯Select
<input type=text name=re_name
style=”width:100px;height:21px;font-size:10pt;”><span
style=”width:18px;border:0px solid red;”><select name=”r00″
style=”margin-left:-100px;width:118px; background-color:#FFEEEE;”
onChange=”document.all.re_name.value=this.value;”>
??????????????? <option value=”1″>11111111<option>
??????????????? <option value=”2″>222222</option>
??????????????? <option value=”3″>333333</option>
????????????? </select>
????????????? </span>
//設(shè)置光標(biāo)位置

//頁(yè)內(nèi)查找

//自定義提示條

<a href=”#” title=”這是提示”>tip</a>
<script Language=”JavaScript”>
//***********默認(rèn)設(shè)置定義.*********************
tPopWait=50;//停留tWait豪秒后顯示提示。
tPopShow=5000;//顯示tShow豪秒后關(guān)閉提示
showPopStep=20;
popOpacity=99;
//***************內(nèi)部變量定義*****************
sPop=null;
curShow=null;
tFadeOut=null;
tFadeIn=null;
tFadeWaiting=null;
document.write(“<style type=’text/css’id=’defaultPopStyle’>”);
document.write(“.cPopText {? background-color: #F8F8F5;color:#000000; border:
1px #000000 solid;font-color: font-size: 12px; padding-right: 4px; padding-left:
4px; height: 20px; padding-top: 2px; padding-bottom: 2px; filter:
Alpha(Opacity=0)}”);
document.write(“</style>”);
document.write(“<div id=’dypopLayer’ style=’position:absolute;z-index:1000;’
class=’cPopText’></div>”);

1.注銷組件
regsvr32 /u scrrun.dll
2.修改PROGID?
HKEY_CLASSES_ROOT\Scripting.FileSystemObject
Scripting.FileSystemObject
3.對(duì)于使用object的用戶，修改HKEY_CLASSES_ROOT\Scripting.

//省略號(hào)
<DIV STYLE=”width: 120px; height: 50px; border: 1px solid blue;
??????????? overflow: hidden; text-overflow:ellipsis”>
<NOBR>就是比如有一行文字，很長(zhǎng)，表格內(nèi)一行顯示不下.</NOBR>
</DIV>
//檢測(cè)media play版本

<IE:clientCaps ID=”oClientCaps” style=”{behavior:url(#default#clientcaps)}” />
<SCRIPT>
var flash=”";
??? WMPVersion=
oClientCaps.getComponentVersion(“{22D6F312-B0F6-11D0-94AB-0080C74C7E95}”,”ComponentID”);
?
??? if (WMPVersion != “”) {
??? flash = “”;
??? var version = WMPVersion.split(“,”);
??? var i;
??? for (i = 0; i < version.length; i++) {
????? if (i != 0)
??? flash += “.”;
????? flash += version[i];
??? }
???? document.write(“您的Windows Media Player 版本是:”+flash+”<p>”);
? }
</SCRIPT>
//圖象按比例

//Import

function Import() {
?for( var i=0; i<arguments.length; i++ ) {
? var file = arguments[i];
? if ( file.match(/\.js$/i))?
?? document.write(‘<script type=\”text/javascript\” src=\”‘ + file + ‘\”></sc’ +
‘ript>’);
? else
?? document.write(‘<style type=\”text/css\”>@import \”‘ + file + ‘\”
;</style>’);
?}
};

//js枚舉
function getComputerName()
{
?var objWMIService = GetObject(“Winmgmts:root\cimv2″);
?for(e = new Enumerator(objWMIService) ; !e.atEnd() ; e.moveNext())
?{
??? var getComputer = e.item();
??? return getComputer.Name;
?}
}
//條件編譯

<SCRIPT LANGUAGE=”JavaScript”>
<!–
?var xmlDoc = new ActiveXObject(“Msxml2.DOMDocument.4.0″);
?var currNode;
?xmlDoc.async = false;
?xmlDoc.async = false;
?xmlDoc.loadXML(“<TABLENAME>????? 你好你阿三??? 大法???? 司法等四?????????????
</TABLENAME>”);
?currNode = xmlDoc.documentElement;
???
? var s = currNode.xml;
? var r = /\<([^\>\s]*?)[^\>]*?\>([^\<]*?)\<\/\1\>/
? var b = s.replace(r,”$2″);
? alert(b);
//–>
</SCRIPT>
//mergeAttributes 復(fù)制所有讀/寫標(biāo)簽屬性到指定元素。
<SCRIPT>
function fnMerge(){
oSource.children[1].mergeAttributes(oSource.children[0]);
}
</SCRIPT>
<SPAN ID=oSource>
<DIV
ID=”oDiv”
ATTRIBUTE1=”true”
ATTRIBUTE2=”true”
οnclick=”alert(‘click’);”
οnmοuseοver=”this.style.color=’#0000FF’;”
οnmοuseοut=”this.style.color=’#000000′;”
>
This is a sample <B>DIV</B> element.
</DIV>
<DIV ID=”oDiv2″>
This is another sample <B>DIV</B> element.
</DIV>
</SPAN>
<INPUT
TYPE=”button”
VALUE=”Merge Attributes”
οnclick=”fnMerge()”

轉(zhuǎn)載于:https://blog.51cto.com/sjsycn/408222

總結(jié)

以上是生活随笔為你收集整理的javascript最常用的技巧的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。

上一篇：移相全桥DCDC通过Simulink扫频
下一篇： php样式模板,word样式和模板的区别