ทักษะ JavaScript ที่ใช้งานได้จริงที่นักพัฒนาเว็บต้องรวบรวมสำหรับการอ้างอิงของคุณ เนื้อหาเฉพาะมีดังนี้
1. ปุ่มเมาส์ขวาจะถูกบล็อกอย่างสมบูรณ์
onContextMenu =” window.event.returnvalue = false”
<Table Border OnContextMenu = return (false)> <td> ไม่สามารถใช้สำหรับตาราง
2. ไม่เลือกและป้องกันการคัดลอก
<body onSelectStart =” return false”>
3.js ไม่อนุญาตให้วาง
onPaste =” ส่งคืนเท็จ”
4. JS ป้องกันการคัดลอก
oncopy =” return false;” oncut =” return false;”
5. เปลี่ยนเป็นไอคอนของคุณเองหน้าแถบที่อยู่ IE
<link rel =” ไอคอนทางลัด” href =” favicon.ico”>
ใส่ภาพนี้ในไดเรกทอรีรูทของไฟล์และแก้ไขคำต่อท้ายเป็น ICO
6. คุณสามารถแสดงไอคอนของคุณในรายการโปรดของคุณ
<link rel =” bookmark” href =” favicon.ico”>
7. ปิดวิธีการป้อนข้อมูล
<อินพุต style = "ime-mode: disabled">
8. พกเฟรมเสมอ
<ภาษาสคริปต์ =” JavaScript”> <!
if (window == top) top.location.href = "frames.htm"; //frames.htm เป็นเว็บเพจเฟรม
//> </script>
9. ป้องกันเฟรมจากการเป็น
<ภาษาสคริปต์ = JavaScript> <!
if (top.location! = self.location) top.location = self.location;
//> </script>
10. หน้าเว็บจะไม่ถูกบันทึกเป็น
<Noscript> <iframe src =*. html> < /iframe> </oscript>
11. <อินพุตประเภท = ค่าปุ่ม = ดูซอร์สโค้ดหน้าเว็บ
onclick =” window.location =“ view-source:”+“ http://www.pconline.com.cn””>
12. ยืนยันเมื่อลบ
<a href = "JavaScript: ถ้า (ยืนยัน (" จำเป็นต้องลบจริงหรือไม่? ")) location =" boos.asp? & areyou = ลบ
& page = 1″”> ลบ </a>
13. รับตำแหน่งที่แน่นอนของการควบคุม
// javascript <script language =” JavaScript”> ฟังก์ชั่น getie (e) {var t = e.offsettop; var l = e.offsetleft; ในขณะที่ (e = e.offsetParent) {t+= e.offSettop; l+= e.offsetleft;} การแจ้งเตือน ("top ="+t+"/nleft ="+l);} </script> // vbscript <script language = "vbscript"> <! a = document.all.img1t = document.all.img1.offsettoplp = document.all.img1.offsetleft ในขณะที่ a.tagname <> "body" ตั้งค่า a = a.offsetparentt = t+a.offsettopl = l+a.offsetleftwendmsgbox "top =" & t & chr (13)14. เคอร์เซอร์หยุดในตอนท้ายของกล่องข้อความ
<ภาษาสคริปต์ =” JavaScript”> ฟังก์ชั่น cc () {var e = event.srecelement; var r = e.createtextrange (); r.movestart ("ตัวละคร", e.value.length); r.collapse (จริง); r.select ();15. กำหนดแหล่งที่มาของหน้าก่อนหน้า
JavaScript:
document.referrer
16. ย่อขนาดสูงสุดปิดหน้าต่าง
<Object ID = HH1 classID =” ClSID: ADB880A6-D8FF-11CF-9377-00AA003B7A11″> <param name =” command” value =” ย่อ”> < /object> <Object ID = HH2 classId =” ClSID name =” command” value =” สูงสุด”> < /object> <object id = hh3 classid =” clsid: adb880a6-d8ff-11cf-9377-00aa003b7a11″> <param name =” value =” ปิด”> < /object> onclick = hh2.click ()> <อินพุตประเภท = ค่าปุ่ม = ปิด onclick = hh3.click ()>
ตัวอย่างนี้ใช้กับ IE
17. ปุ่มฟังก์ชั่นบล็อก Shift, Alt, Ctrl
<script> ฟังก์ชั่น look () {ถ้า (event.shiftkey) การแจ้งเตือน ("ห้ามเปลี่ยนคีย์!"); // สามารถแทนที่ด้วย alt ctrl} document.onkeydown = look; </script>18. หน้าเว็บจะไม่ถูกแคช
<meta http-equiv =” pragma” content =” ไม่มีแคช”>
<meta http-equiv =” cache-control” content =” ไม่มีแคชต้องทำการตรวจสอบ”>>
<meta http-equiv =” หมดอายุ” เนื้อหา =” Wed, 26 ก.พ. 1997 08:21:57 GMT”>
หรือ <meta http-equiv =” หมดอายุ” content =” 0″>
19. วิธีการทำให้ฟอร์มไม่มีความรู้สึกเว้าและนูน?
<ประเภทอินพุต = text style =” border: 1 solid #000000″>
หรือ
<ประเภทอินพุต = รูปแบบข้อความ =” ชายแดนซ้าย: ไม่มี; ชายแดนขวา: ไม่มี;
1 Solid #000000″> < /textarea>
20. ความแตกต่างระหว่าง <div> <pan> & <เลเยอร์>?
<div> (การแบ่ง) ใช้เพื่อกำหนดองค์ประกอบขนาดใหญ่ขององค์ประกอบหน้าซึ่งจะทำให้เกิดการถ่ายโอนบรรทัด
<span> ใช้เพื่อกำหนดองค์ประกอบในบรรทัดเดียวกัน ความแตกต่างเพียงอย่างเดียวระหว่าง <div> คือมันไม่ได้สร้างการถ่ายโอนสาย
<layer> เป็นแท็กของ NS คือไม่รองรับซึ่งเทียบเท่ากับ <div>
21. ปล่อยให้หน้าต่างป๊อปอัปอยู่ด้านบนเสมอ:
<body onblur = "this.focus ();">
22. อย่าเลื่อนแถบเหรอ?
ให้แถบแนวตั้งไม่:
<body style = "overflow: scroll; overflow-y: hidden">
</body>
ให้แถบแนวนอนไม่:
<body style = "overflow: scroll; overflow-x: hidden">
</body>
ลบทั้งสอง? ง่ายกว่า
<body scroll = "ไม่">
</body>
23. จะลบเส้นประรอบ ๆ รูปภาพได้อย่างไรหลังจากคลิกที่ลิงค์รูปภาพ
<a href = "#" onfocus = "this.blur ()"> <img src = "logo.jpg" border = 0> < /a
24. แบบฟอร์มการส่งอีเมลการประมวลผล
<form name =” form1″ method =” post” action =” mailto: ****@***. com” enctype =” ข้อความ/ธรรมดา”>>
<ประเภทอินพุต = ส่ง>
</form>
25. วิธีเขียนในรหัสของการรีเฟรชหน้าต่างหลักในหน้าต่างเด็กเปิด?
window.opener.location.reload ()
26. วิธีการตั้งค่าขนาดของหน้าเพื่อเปิด
<body onload =” top.resizeto (300,200);”>
ตำแหน่งที่เปิดหน้า <body onload = "top.moveby (300,200);">
27. วิธีเพิ่มภาพพื้นหลังที่ไม่เต็มบนหน้าและภาพพื้นหลังยังคงไม่ถูกต้องเมื่อดึงหน้า
<style>
ร่างกาย
{background-image: ไม่มี; พื้นหลังซ้ำ: ไม่ทำซ้ำ;
ตำแหน่งพื้นหลัง: กึ่งกลาง; การติดตั้งพื้นหลัง: แก้ไข}
</style>
28. ตรวจสอบว่าสตริงประกอบด้วยตัวเลขหรือไม่
<ภาษาสคริปต์ =” JavaScript”> <!
ฟังก์ชั่น checknum (str) {return str.match (// d/) == null}
การแจ้งเตือน (CheckNum ("1232142141")))))))))))))
การแจ้งเตือน (CheckNum ("123214214A1")))))))))))))
//> </script>
29. รับขนาดของหน้าต่าง
document.body.clientwidth; document.body.clientheight
30. วิธีการพิจารณาว่าเป็นตัวละคร
if (/[8/x00-/xff เหมือนกัน/g.test(s)) การแจ้งเตือน ("มีอักขระจีน");
การแจ้งเตือนอื่น ("อักขระทั้งหมด");
31.TextArea ข้อความปรับตัวกี่บรรทัด
<textarea rows = 1 name = s1 cols = 27 onPropertyChange =” this.style.posheight = this.scrollheight”>
< /textarea>
32. วันที่ลบวันเท่ากับวันที่สอง
<ภาษาสคริปต์ = JavaScript> ฟังก์ชั่น cc (dd, dadd) {// การจัดการข้อผิดพลาดสามารถเพิ่ม var a = วันที่ใหม่ (dd) a = a.valueof () a = a dadd * 24 * 60 * 60 * 1000a = วันที่ใหม่ (a) การแจ้งเตือน "วัน")} cc ("12/23/2002", 2) </script>33. เลือกวิทยุใด
<html> <script language =” vbscript”> ฟังก์ชั่น checkme () สำหรับแต่ละ ob ใน radio1if ob ตรวจสอบแล้ว window.alert ob.valuenextend function < /script> <body> <input name =” Radio1″ type =” Radio” value =” style” onclick =” checkme ()”> </body> </html>
34. สคริปต์ไม่เคยผิดพลาด
<ภาษาสคริปต์ =” JavaScript”> <! hidefunction killerrors () {return true;} window.onerror = killerrors; //> </script>35. ปุ่ม Enter อนุญาตให้เคอร์เซอร์ย้ายไปยังกล่องอินพุตถัดไป
<อินพุต onkeydown =” ถ้า (event.keycode == 13) event.keycode = 9″>
36. ตรวจจับความเร็วลิงก์ของเว็บไซต์บางแห่ง:
เพิ่มรหัสต่อไปนี้ในพื้นที่ <body>:
<ภาษาสคริปต์ = JavaScript> TIM = 1SetInterval ("TIM ++", 100) B = 1VAR Autourl = ใหม่ array () autourl [1] = "www.njcatv.net" autourl [2] = "javacool.3322.net" autourl [3] = "www.sina.com.cn" autourl [4] = "www.nua.edu.cn ชื่อฟอร์ม = autof> ") สำหรับ (var i = 1; i <autourl.length; i ++) document.write (" <อินพุตประเภท = ชื่อข้อความ = txt”+i+” size = 10 ค่า = ในการทดสอบ ... > =》 <อินพุต = textName = url”+i+” 40> =》 <ประเภทอินพุต value = goonclick = window.open (this.form.url”+i+”. value)> ") document.write (" <อินพุตประเภท = ส่งค่า = refresh> </form> ")} butt () ฟังก์ชั่นอัตโนมัติ (url) {document.forms [0] [" url "+b] หมดเวลา "} else {document.forms [0] [" txt "+b] .value =" เวลา "+tim/10+" วินาที "} b ++} ฟังก์ชั่น run () {สำหรับ (var i = 1; i <autourl.length; i ++) เอกสาร ความสูง = 1Onerror = auto ("http: //"+autourl+"")> ")} run () </script>37. เคอร์เซอร์หลายรูปแบบ
อัตโนมัติ: เคอร์เซอร์มาตรฐาน
ค่าเริ่มต้น: ลูกศรมาตรฐาน
มือ: เคอร์เซอร์มือ
รอ: รอเคอร์เซอร์
ข้อความ: เคอร์เซอร์รูปตัวฉัน
ข้อความแนวตั้ง: เคอร์เซอร์รูปแนวนอน
ไม่ลดลง: เคอร์เซอร์ไม่สามารถลากได้
ไม่อนุญาต: เคอร์เซอร์ไม่ถูกต้อง
ความช่วยเหลือ:? เคอร์เซอร์ช่วยเหลือ
All-Scroll: เครื่องหมายทิศทางสามเหลี่ยม
ย้าย: แท็กมือถือ
Crosshair: Crosshair
อิเล็กทรอนิกส์
N-resize
NW-resize
W-resize
S-resize
ขนาดที่เพิ่มขึ้น
ขนาด SW
38. เอฟเฟกต์พิเศษสำหรับการเข้าหน้าและออก
ป้อนหน้า <meta http-equiv =” page-enter” content =” reviewtrans (duration = x, transition = y)”>>
หน้าวางจำหน่าย <meta http-equiv =” page-exit” content =” reviewtrans (duration = x, transition = y)”>
นี่คือเอฟเฟกต์พิเศษบางอย่างเมื่อมีการโหลดหน้าเว็บและเรียกออกมา ระยะเวลาแสดงถึงระยะเวลาของเอฟเฟกต์พิเศษในไม่กี่วินาที
การเปลี่ยนแปลงระบุว่าจะใช้เอฟเฟกต์พิเศษใดค่าคือค่า
1-23:
0 สี่เหลี่ยมหดตัว
การขยายรูปสี่เหลี่ยมผืนผ้า 1 ครั้ง
2 รอบหด
3 การขยายวงกลม
4 ลงไปด้านบนเพื่อรีเฟรช
5 รีเฟรชขึ้นไปลง
6 รีเฟรชจากซ้ายไปขวา
7 ขวาไปซ้ายรีเฟรช
8 มู่ลี่แนวตั้ง
9 มู่ลี่แนวนอน
10 มู่ลี่แนวนอนที่พลัดถิ่น
11 มู่ลี่แนวตั้ง
12 คะแนนของการแพร่กระจาย
13 รีเฟรชรอบกลาง
14 รีเฟรชกลางไปซ้ายและขวา
15 กลางถึงด้านบน
16 ขึ้นและลงไปกลาง
17 ล่างขวาไปซ้ายบน
18 บนขวาไปล่างซ้ายล่าง
19 บนซ้ายไปล่างขวาล่าง
20 ล่างซ้ายไปบนขวาบน
21 แถบแนวนอน
22 แถบแนวตั้ง
23 หรือมากกว่าสุ่มเลือกหนึ่งใน 22 ประเภท
39. กระโดดภายในเวลาที่กำหนด
<meta http-equiv = v =” รีเฟรช” เนื้อหา =” 5; url = http: //www.51js.com”>
40. ไม่ว่าจะดึงหน้าเว็บมาใช้
<meta name =” Robots” content =” ค่าแอตทริบิวต์”>
ค่าแอตทริบิวต์มีดังนี้:
ค่าแอตทริบิวต์คือ "ทั้งหมด": ไฟล์จะถูกเรียกคืนและลิงก์ในหน้าสามารถสอบถามได้;
ค่าแอตทริบิวต์คือ "ไม่มี": ไฟล์ไม่ได้รับการเรียกคืนและลิงก์ในหน้าไม่ได้ทำการสืบค้น
ค่าแอตทริบิวต์คือ "ดัชนี": ไฟล์จะถูกเรียกคืน;
ค่าแอตทริบิวต์คือ "ติดตาม": ลิงก์ในหน้าการสืบค้น
ค่าแอตทริบิวต์คือ "noindex": ไฟล์ไม่ได้รับการเรียกคืน แต่สามารถสืบค้นสำหรับลิงก์;
ค่าคุณสมบัติคือ "nofollow": ไฟล์ไม่ได้รับการเรียกคืน แต่ลิงก์ในหน้าสามารถสอบถามได้
41. ป้อน
ใช้สคริปต์ไคลเอ็นต์เพื่อเพิ่มเหตุการณ์ onkeydown ของเอกสารไปยังหน้าเพื่อให้หน้าสามารถดำเนินการแท็บหลังจากได้รับเหตุการณ์การส่งคืนรถ
ฟังก์ชั่นของคีย์คือการเปลี่ยนปุ่มของเหตุการณ์ตั้งแต่ 13 เป็น 9
รหัส JavaScript มีดังนี้:
<script language =” javascript” สำหรับ =” เอกสาร” event =” onkeydown”> <! ถ้า (event.keycode == 13) event.keycode = 9;> </script>
วิธีการประมวลผลนี้สามารถเลื่อนโฟกัสลงได้ แต่มันก็มีบทบาทเดียวกันกับปุ่ม โดยทั่วไปลูกค้าได้เข้าสู่
หลังจากที่ข้อมูลถูกกระโดดไปที่ปุ่มแล้วควรกด "ป้อน" โดยตรงเพื่อส่งข้อมูล ดังนั้นวิธีการข้างต้นจะต้องดำเนินการ
สำหรับการดัดแปลงปุ่ม "ส่ง" ไม่ควรเลื่อน การส่งควรเปิดใช้งานโดยตรง
ดังนั้นฉันจึงทำการปรับเปลี่ยนรหัสด้านบนนั่นคือเพื่อพิจารณาว่า "แหล่งที่มา" ของเหตุการณ์คือปุ่มส่งหรือไม่ รหัสมีดังนี้:
<script language =” javaScript” สำหรับ =” เอกสาร” event =” onkeydown”> <! ถ้า (event.keycode == 13 && event.srcelement.type! = 'ปุ่ม' && event.srcelement.type! = 'ส่ง' && event.srclement.type! Event.srcelement.type! = ") event.keycode = 9;> </script>
ตรวจสอบว่าเป็นปุ่มหรือไม่เพราะจะมี type = "ปุ่ม" บน html
ตรวจสอบว่ามีการส่งหรือไม่เนื่องจากมี type = "ส่ง" บน html
ตรวจสอบว่าควรรีเซ็ตหรือไม่เนื่องจากควรดำเนินการ "รีเซ็ต" บน HTML
การตัดสินคือมันว่างเปล่าเพราะควรดำเนินการ "<a> ลิงก์" บน HTML ด้วย สถานการณ์นี้ไม่ได้เกิดขึ้นมาก คุณสามารถใช้วิธี "tabindex = -1" เพื่อยกเลิกการเชื่อมโยงและรับโฟกัส
ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์ต่อการเรียนรู้ของทุกคนและฉันหวังว่าทุกคนจะสนับสนุน wulin.com มากขึ้น