41個(gè)Web開(kāi)發(fā)者必須收藏的JavaScript實(shí)用技巧
來(lái)源:易賢網(wǎng) 閱讀:978 次 日期:2016-07-29 15:23:30
溫馨提示:易賢網(wǎng)小編為您整理了“41個(gè)Web開(kāi)發(fā)者必須收藏的JavaScript實(shí)用技巧”,方便廣大網(wǎng)友查閱!

Web開(kāi)發(fā)者必須收藏的JavaScript實(shí)用技巧,供大家參考,具體內(nèi)容如下

1. 將徹底屏蔽鼠標(biāo)右鍵

oncontextmenu=”window.event.returnValue=false”

< table border oncontextmenu=return(false)>< td>no< /table> 可用于 Table

2. 取消選取、防止復(fù)制

< body onselectstart=”return false”>

3.JS不允許粘貼

onpaste=”return false”

4. JS防止復(fù)制

oncopy=”return false;” oncut=”return false;”

5. IE 地址欄前換成自己的圖標(biāo)

< link rel=”Shortcut Icon” href=”favicon.ico”>

在文件的根目錄放進(jìn)去這個(gè)圖片,后綴修改成ico就可以了

6.可以在收藏夾中顯示出你的圖標(biāo)

< link rel=”Bookmark” href=”favicon.ico”>

7.關(guān)閉輸入法

< input style=”ime-mode:disabled”>

8. 永遠(yuǎn)都會(huì)帶著框架

< script language=”JavaScript”>< !–

if (window == top)top.location.href = “frames.htm”; //frames.htm 為框架網(wǎng)頁(yè)

// –>< /script>

9. 防止被人 frame

< SCRIPT LANGUAGE=JAVASCRIPT>< !–

if (top.location != self.location)top.location=self.location;

// –>< /SCRIPT>

10. 網(wǎng)頁(yè)將不能被另存為

< noscript>< iframe src=*.html>< /iframe>< /noscript>

11. < input type=button value=查看網(wǎng)頁(yè)源代碼

onclick=”window.location = “view-source:”+ “http://www.pconline.com.cn””>

12. 刪除時(shí)確認(rèn)

< a href=”javascript:if(confirm(” 確 實(shí) 要 刪 除 嗎 ?”))location=”boos.asp?&areyou= 刪 除

&page=1″”>刪除< /a>

13. 取得控件的絕對(duì)位置

//Javascript

< script language=”Javascript”>

function getIE(e){

var t=e.offsetTop;

var l=e.offsetLeft;

while(e=e.offsetParent){

t+=e.offsetTop;

l+=e.offsetLeft;

}

alert(“top=”+t+”/nleft=”+l);

}

< /script>

//VBScript

< script language=”VBScript”>< !–

function getIE()

dim t,l,a,b

set a=document.all.img1

t=document.all.img1.offsetTop

l=document.all.img1.offsetLeft

while a.tagName< >”BODY”

set a = a.offsetParent

t=t+a.offsetTop

l=l+a.offsetLeft

wend

msgbox “top=”&t&chr(13)&”left=”&l,64,”得到控件的位置”

end function

–>< /script>

14. 光標(biāo)是停在文本框文字的最后

< script language=”javascript”>

function cc()

{

var e = event.srcElement;

var r =e.createTextRange();

r.moveStart(“character”,e.value.length);

r.collapse(true);

r.select();

}

< /script>

< input type=text name=text1 value=”123″ onfocus=”cc()”>

15. 判斷上一頁(yè)的來(lái)源

javascript:

document.referrer

16. 最小化、最大化、關(guān)閉窗口

< object id=hh1 classid=”clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11″>

< param name=”Command” value=”Minimize”>< /object>

< object id=hh2 classid=”clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11″>

< param name=”Command” value=”Maximize”>< /object>

< OBJECT id=hh3 classid=”clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11″>

< PARAM NAME=”Command” VALUE=”Close”>< /OBJECT>

< input type=button value=最小化 onclick=hh1.Click()>

< input type=button value=最大化 onclick=hh2.Click()>

< input type=button value=關(guān)閉 onclick=hh3.Click()>

本例適用于 IE

17.屏蔽功能鍵 Shift,Alt,Ctrl

< script>

function look(){

if(event.shiftKey)

alert(“禁止按 Shift 鍵!”); //可以換成 ALT CTRL

}

document.onkeydown=look;

< /script>

18. 網(wǎng)頁(yè)不會(huì)被緩存

< META HTTP-EQUIV=”pragma” CONTENT=”no-cache”>

< META HTTP-EQUIV=”Cache-Control” CONTENT=”no-cache, must-revalidate”>

< META HTTP-EQUIV=”expires” CONTENT=”Wed, 26 Feb 1997 08:21:57 GMT”>

或者< META HTTP-EQUIV=”expires” CONTENT=”0″>

19.怎樣讓表單沒(méi)有凹凸感?

< input type=text style=”border:1 solid #000000″>

< input type=text style=”border-left:none; border-right:none; border-top:none; border-bottom:

1 solid #000000″>< /textarea>

20.< div>< span>&< layer>的區(qū)別?

< div>(division)用來(lái)定義大段的頁(yè)面元素,會(huì)產(chǎn)生轉(zhuǎn)行

< span>用來(lái)定義同一行內(nèi)的元素,跟< div>的唯一區(qū)別是不產(chǎn)生轉(zhuǎn)行

< layer>是 ns 的標(biāo)記,ie 不支持,相當(dāng)于< div>

21.讓彈出窗口總是在最上面:

< body onblur=”this.focus();”>

22.不要滾動(dòng)條?

讓豎條沒(méi)有:

< body style=”overflow:scroll;overflow-y:hidden”>

< /body>

讓橫條沒(méi)有:

< body style=”overflow:scroll;overflow-x:hidden”>

< /body>

兩個(gè)都去掉?更簡(jiǎn)單了

< body scroll=”no”>

< /body>

23.怎樣去掉圖片鏈接點(diǎn)擊后,圖片周?chē)奶摼€?

< a href=”#” onFocus=”this.blur()”>< img src=”logo.jpg” border=0>< /a>

24.電子郵件處理提交表單

< form name=”form1″ method=”post” action=”mailto:****@***.com” enctype=”text/plain”>

< input type=submit>

< /form>

25.在打開(kāi)的子窗口刷新父窗口的代碼里如何寫(xiě)?

window.opener.location.reload()

26.如何設(shè)定打開(kāi)頁(yè)面的大小

< body onload=”top.resizeTo(300,200);”>

打開(kāi)頁(yè)面的位置< body onload=”top.moveBy(300,200);”>

27.在頁(yè)面中如何加入不是滿(mǎn)鋪的背景圖片,拉動(dòng)頁(yè)面時(shí)背景圖不動(dòng)

< STYLE>

body

{background-image:none; background-repeat:no-repeat;

background-position:center;background-attachment: fixed}

< /STYLE>

28. 檢查一段字符串是否全由數(shù)字組成

< script language=”Javascript”>< !–

function checkNum(str){return str.match(//D/)==null}

alert(checkNum(“1232142141”))

alert(checkNum(“123214214a1”))

// –>< /script>

29. 獲得一個(gè)窗口的大小

document.body.clientWidth; document.body.clientHeight

30. 怎么判斷是否是字符

if (/[^/x00-/xff]/g.test(s)) alert(“含有漢字”);

else alert(“全是字符”);

31.TEXTAREA 自適應(yīng)文字行數(shù)的多少

< textarea rows=1 name=s1 cols=27 onpropertychange=”this.style.posHeight=this.scrollHeight”>

< /textarea>

32. 日期減去天數(shù)等于第二個(gè)日期

< script language=Javascript>

function cc(dd,dadd)

{

//可以加上錯(cuò)誤處理

var a = new Date(dd)

a = a.valueOf()

a = a – dadd * 24 * 60 * 60 * 1000

a = new Date(a)

alert(a.getFullYear() + “年” + (a.getMonth() + 1) + “月” + a.getDate() + “日”)

}

cc(“12/23/2002”,2)

< /script>

33. 選擇了哪一個(gè) Radio

< HTML>< script language=”vbscript”>

function checkme()

for each ob in radio1

if ob.checked then window.alert ob.value

next

end function

< /script>< BODY>

< INPUT name=”radio1″ type=”radio” value=”style” checked>Style

< INPUT name=”radio1″ type=”radio” value=”barcode”>Barcode

< INPUT type=”button” value=”check” onclick=”checkme()”>

< /BODY>< /HTML>

34. 腳本永不出錯(cuò)

< SCRIPT LANGUAGE=”JavaScript”>

< !– Hide

function killErrors() {

return true;

}

window.onerror = killErrors;

// –>

< /SCRIPT>

35. ENTER 鍵可以讓光標(biāo)移到下一個(gè)輸入框

< input onkeydown=”if(event.keyCode==13)event.keyCode=9″>

36. 檢測(cè)某個(gè)網(wǎng)站的鏈接速度:

把如下代碼加入< body>區(qū)域中:

< script language=Javascript>

tim=1

setInterval(“tim++”,100)

b=1

var autourl=new Array()

autourl[1]=”www.njcatv.net”

autourl[2]=”javacool.3322.net”

autourl[3]=”www.sina.com.cn”

autourl[4]=”www.nuaa.edu.cn”

autourl[5]=”www.cctv.com”

function butt(){

document.write(“< form name=autof>”)

for(var i=1;i< autourl.length;i++)

document.write(“< input type=text name=txt”+i+” size=10 value=測(cè)試中……> =》< input

type=text

name=url”+i+” size=40> =》< input type=button value=GO

onclick=window.open(this.form.url”+i+”.value)>

“)

document.write(“< input type=submit value=刷新>< /form>”)

}

butt()

function auto(url){

document.forms[0][“url”+b].value=url

if(tim>200)

{document.forms[0][“txt”+b].value=”鏈接超時(shí)”}

else

{document.forms[0][“txt”+b].value=”時(shí)間”+tim/10+”秒”}

b++

}

function run(){for(var i=1;i< autourl.length;i++)document.write(“< img

src=http://”+autourl+”/”+Math.random()+”

width=1 height=1

onerror=auto(“http://”+autourl+””)>”)}

run()< /script>

37. 各種樣式的光標(biāo)

auto :標(biāo)準(zhǔn)光標(biāo)

default :標(biāo)準(zhǔn)箭頭

hand :手形光標(biāo)

wait :等待光標(biāo)

text :I 形光標(biāo)

vertical-text :水平 I 形光標(biāo)

no-drop :不可拖動(dòng)光標(biāo)

not-allowed :無(wú)效光標(biāo)

help :?幫助光標(biāo)

all-scroll :三角方向標(biāo)

move :移動(dòng)標(biāo)

crosshair :十字標(biāo)

e-resize

n-resize

nw-resize

w-resize

s-resize

se-resize

sw-resize

38. 頁(yè)面進(jìn)入和退出的特效

進(jìn)入頁(yè)面< meta http-equiv=”P(pán)age-Enter” content=”revealTrans(duration=x, transition=y)”>

推出頁(yè)面< meta http-equiv=”P(pán)age-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 以上 22 種隨機(jī)選擇一種

39. 在規(guī)定時(shí)間內(nèi)跳轉(zhuǎn)

< META http-equiv=V=”REFRESH” content=”5;URL=http://www.51js.com”>

40. 網(wǎng)頁(yè)是否被檢索

< meta name=”ROBOTS” content=”屬性值”>

其中屬性值有以下一些:

屬性值為”all”: 文件將被檢索,且頁(yè)上鏈接可被查詢(xún);

屬性值為”none”: 文件不被檢索,而且不查詢(xún)頁(yè)上的鏈接;

屬性值為”index”: 文件將被檢索;

屬性值為”follow”: 查詢(xún)頁(yè)上的鏈接;

屬性值為”noindex”: 文件不檢索,但可被查詢(xún)鏈接;

屬性值為”nofollow”: 文件不被檢索,但可查詢(xún)頁(yè)上的鏈接。

41. 回車(chē)

用客戶(hù)端腳本在頁(yè)面添加document 的onkeydown事件,讓頁(yè)面在接受到回車(chē)事件后,進(jìn)行Tab

鍵的功能,即只要把 event 的 keyCode 由 13 變?yōu)?9

Javascript 代碼如下:

<script language=”javascript” for=”document” event=”onkeydown”>

<!–

if(event.keyCode==13)

event.keyCode=9;

–>

</script>

這樣的處理方式,可以實(shí)現(xiàn)焦點(diǎn)往下移動(dòng),但對(duì)于按鈕也起同樣的作用,一般的客戶(hù)在輸入完

資料以后,跳到按鈕后,最好能直接按”回車(chē)”進(jìn)行數(shù)據(jù)的提交.因此,對(duì)上面的方法要進(jìn)行一下

修改,應(yīng)該對(duì)于”提交”按鈕不進(jìn)行焦點(diǎn)轉(zhuǎn)移.而直接激活提交.

因此我對(duì)上面的代碼進(jìn)行了一個(gè)修改,即判斷事件的”源”,是否為提交按鈕,代碼如下:

<script language=”javascript” for=”document” event=”onkeydown”>

<!–

if(event.keyCode==13 && event.srcElement.type!='button' &&

event.srcElement.type!='submit' && event.srcElement.type!='reset' &&

event.srcElement.type!='textarea' && event.srcElement.type!=”)

event.keyCode=9;

–>

</script>

判斷是否為 button, 是因?yàn)樵?HTML 上會(huì)有 type=”button”

判斷是否為 submit,是因?yàn)?HTML 上會(huì)有 type=”submit”

判斷是否為 reset,是因?yàn)?HTML 上的”重置”應(yīng)該要被執(zhí)行

判斷是否為空,是因?yàn)閷?duì)于 HTML 上的”<a>鏈接”也應(yīng)該被執(zhí)行,這種情況發(fā)生的情況不多,可以使用”tabindex=-1″的方式來(lái)取消鏈接獲得焦點(diǎn)。

以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助

更多信息請(qǐng)查看網(wǎng)絡(luò)編程
由于各方面情況的不斷調(diào)整與變化,易賢網(wǎng)提供的所有考試信息和咨詢(xún)回復(fù)僅供參考,敬請(qǐng)考生以權(quán)威部門(mén)公布的正式信息和咨詢(xún)?yōu)闇?zhǔn)!
關(guān)于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡(jiǎn)要咨詢(xún) | 簡(jiǎn)要咨詢(xún)須知 | 加入群交流 | 手機(jī)站點(diǎn) | 投訴建議
工業(yè)和信息化部備案號(hào):滇ICP備2023014141號(hào)-1 云南省教育廳備案號(hào):云教ICP備0901021 滇公網(wǎng)安備53010202001879號(hào) 人力資源服務(wù)許可證:(云)人服證字(2023)第0102001523號(hào)
云南網(wǎng)警備案專(zhuān)用圖標(biāo)
聯(lián)系電話:0871-65317125(9:00—18:00) 獲取招聘考試信息及咨詢(xún)關(guān)注公眾號(hào):hfpxwx
咨詢(xún)QQ:526150442(9:00—18:00)版權(quán)所有:易賢網(wǎng)
云南網(wǎng)警報(bào)警專(zhuān)用圖標(biāo)