1 สร้างบล็อกสคริปต์
เพื่ออ้างอิงโค้ดโปรแกรมเนื้อหา
<ภาษาสคริปต์ = "จาวาสคริปต์">
รหัส JavaScript ถูกเขียนที่นี่
</script>
2 ซ่อนโค้ดสคริปต์
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
document.write(“สวัสดี”);
-
</สคริปต์>
รหัสที่เกี่ยวข้องจะไม่ถูกดำเนินการในเบราว์เซอร์ที่ไม่รองรับ JavaScript
3 จะแสดงเมื่อเบราว์เซอร์ไม่รองรับ
โค้ดโปรแกรมเนื้อหาอ้างอิง
<โนสคริปท์>
สวัสดีเบราว์เซอร์ที่ไม่ใช่ JavaScript
</noscript>
4 ลิงก์ไฟล์สคริปต์ภายนอก
โค้ดโปรแกรมเนื้อหาอ้างอิง
<script language="JavaScript" src="/"filename.js""></script>
5 สคริปต์ความคิดเห็น
โค้ดโปรแกรมเนื้อหาอ้างอิง
//นี่คือความคิดเห็น
document.write("สวัสดี"); // นี่คือความคิดเห็น
-
ทั้งหมดนี้
คือความคิดเห็น
*/
6 ส่งออกไปยังเบราว์เซอร์
โค้ดโปรแกรมเนื้อหาอ้างอิง
document.write(“<strong>สวัสดี</strong>”);
7 กำหนดตัวแปร
โค้ดโปรแกรมเนื้อหาอ้างอิง
var myVariable = “ค่าบางค่า”;
การเพิ่มสตริง 8 รายการ
รหัสโปรแกรมเนื้อหาอ้างอิง
var myString = “String1” + “String2”;
9 การค้นหาสตริง
รหัสโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
var myVariable = “สวัสดี”;
var therePlace = myVariable.search("ที่นั่น");
document.write(มีสถานที่);
-
</script>
10 การแทนที่สตริง
โค้ดโปรแกรมเนื้อหาอ้างอิง
thisVar.replace(“Monday”,”Friday”);
11 รูปแบบสตริง
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
var myVariable = “สวัสดี”;
document.write(myVariable.big() + “<br>”);
document.write(myVariable.blink() + “<br>”);
document.write(myVariable.bold() + “<br>”);
document.write(myVariable.fixed() + “<br>”);
document.write(myVariable.fontcolor(“สีแดง”) + “<br>”);
document.write(myVariable.fontsize(“18pt”) + “<br>”);
document.write(myVariable.italics() + “<br>”);
document.write(myVariable.small() + “<br>”);
document.write(myVariable.strike() + “<br>”);
document.write(myVariable.sub() + “<br>”);
document.write(myVariable.sup() + “<br>”);
document.write(myVariable.toLowerCase() + “<br>”);
document.write(myVariable.toUpperCase() + “<br>”);
var firstString = "สตริงของฉัน";
var FinalString = firstString.bold().toLowerCase().fontcolor("สีแดง");
-
</script>
12 สร้างอาร์เรย์
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
var myArray = อาร์เรย์ใหม่ (5);
myArray[0] = "รายการแรก";
myArray[1] = “รายการที่สอง”;
myArray[2] = “รายการที่สาม”;
myArray[3] = “รายการที่สี่”;
myArray[4] = “รายการที่ห้า”;
var anotherArray = อาร์เรย์ใหม่("รายการแรก", "รายการที่สอง", "รายการที่สาม", "รายการที่สี่", "รายการที่ห้า");
-
</script>
13 การเรียงลำดับอาร์เรย์
รหัสโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
var myArray = อาร์เรย์ใหม่ (5);
myArray[0] = "z";
myArray[1] = "ค";
myArray[2] = "ง";
myArray[3] = "เป็น";
myArray[4] = "q";
document.write(myArray.sort());
-
</script>
14 แยกสตริง
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
var myVariable = "a,b,c,d";
var stringArray = myVariable.split(",");
document.write(stringArray[0]);
document.write(stringArray[1]);
document.write(stringArray[2]);
document.write(stringArray[3]);
-
</script>
15 ข้อความเตือนป๊อปอัป
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
window.alert(“สวัสดี”);
-
</script>
16 กล่องยืนยันป๊อปอัป
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
var result = window.confirm(“คลิกตกลงเพื่อดำเนินการต่อ”);
-
</script>
17 ฟังก์ชั่นที่กำหนดเอง
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
ฟังก์ชั่นหลายรายการ (หมายเลข 1, หมายเลข 2) {
ผลลัพธ์ var = number1 * number2;
ส่งคืนผลลัพธ์;
-
-
</script>
18 เรียกใช้ฟังก์ชัน JS
โค้ดโปรแกรมเนื้อหาอ้างอิง
<a href=”#” onClick=”functionName()”>ข้อความลิงก์</a>
<a href="/”javascript:functionName"()”>ข้อความลิงก์</a>
19 เรียกใช้ฟังก์ชันหลังจากโหลดหน้าเว็บแล้ว
โค้ดโปรแกรมเนื้อหาอ้างอิง
<body onLoad="functionName();">
เนื้อหาของหน้า
</body>
20 การตัดสินแบบมีเงื่อนไข
โค้ดโปรแกรมเนื้อหาอ้างอิง
<สคริปต์>
-
var userChoice = window.confirm(“เลือกตกลงหรือยกเลิก”);
var result = (userChoice == true) ? “ตกลง” : “ยกเลิก”;
document.write(ผลลัพธ์);
-
</script>
21 ระบุจำนวนลูป
รหัสโปรแกรมเนื้อหาอ้างอิง
<สคริปต์>
-
var myArray = อาร์เรย์ใหม่ (3);
myArray[0] = "รายการ 0";
myArray[1] = "รายการที่ 1";
myArray[2] = "รายการที่ 2";
สำหรับ (i = 0; i < myArray.length; i++) {
document.write(myArray[i] + “<br>”);
-
-
</script>
22 ตั้งค่าการดำเนินการในอนาคต
โค้ดโปรแกรมเนื้อหาอ้างอิง
<สคริปต์>
-
ฟังก์ชั่นสวัสดี() {
window.alert(“สวัสดี”);
-
window.setTimeout("สวัสดี()",5000);
-
</script>
23 ฟังก์ชั่นการดำเนินการตามกำหนดเวลา
โค้ดโปรแกรมเนื้อหาอ้างอิง
<สคริปต์>
-
ฟังก์ชั่นสวัสดี() {
window.alert(“สวัสดี”);
window.setTimeout("สวัสดี()",5000);
-
window.setTimeout("สวัสดี()",5000);
-
</script>
24 ยกเลิกการดำเนินการตามกำหนดเวลา
โค้ดโปรแกรมเนื้อหาอ้างอิง
<สคริปต์>
-
ฟังก์ชั่นสวัสดี() {
window.alert(“สวัสดี”);
-
var myTimeout = window.setTimeout("hello()",5000);
window.clearTimeout(myTimeout);
-
</script>
25 ดำเนินการฟังก์ชันเมื่อยกเลิกการโหลดเพจ
โค้ดโปรแกรมเนื้อหาอ้างอิง
<body onUnload="functionName();">
เนื้อหาของหน้า
</body>
JavaScript เป็นเช่นนี้ 2: ผลลัพธ์ของเบราว์เซอร์
26 เข้าถึงวัตถุเอกสาร
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var myURL = document.URL;
window.alert(myURL);
</script>
27 ส่งออก HTML แบบไดนามิก
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
document.write(“<p>นี่คือข้อมูลบางส่วนเกี่ยวกับเอกสารนี้:</p>”);
document.write(“<ul>”);
document.write(“<li>เอกสารอ้างอิง: “ + document.referrer + “</li>”);
document.write(“<li>โดเมน: “ + document.domain + “</li>”);
document.write(“<li>URL: “ + document.URL + “</li>”);
document.write(“</ul>”);
</script>
28 เอาต์พุตขึ้นบรรทัดใหม่
โค้ดโปรแกรมเนื้อหาอ้างอิง
document.writeln(“<strong>a</strong>”);
document.writeln(“b”);
29 วันที่ส่งออก
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var thisDate = วันที่ใหม่ ();
document.write(thisDate.toString());
</script>
30 ระบุโซนเวลาของวันที่
รหัสโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var myOffset = -2;
var currentDate = วันที่ใหม่ ();
var userOffset = currentDate.getTimezoneOffset()/60;
var timeZoneDifference = userOffset - myOffset;
currentDate.setHours(currentDate.getHours() + timeZoneDifference);
document.write(“เวลาและวันที่ในยุโรปกลางคือ: “ + currentDate.toLocaleString());
</script>
31 กำหนดรูปแบบเอาต์พุตวันที่
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var thisDate = วันที่ใหม่ ();
var thisTimeString = thisDate.getHours() + “:” + thisDate.getMinutes();
var thisDateString = thisDate.getFullYear() + “/” + thisDate.getMonth() + “/” + thisDate.getDate();
document.write(thisTimeString + “ บน “ + thisDateString);
</script>
32 อ่านพารามิเตอร์ URL
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var urlParts = document.URL.split("?");
var parameterParts = urlParts[1].split(“&”);
สำหรับ (i = 0; i < parameterParts.length; i++) {
var pairParts = parameterParts[i].split(“=");
var pairName = pairParts[0];
var pairValue = pairParts [1];
document.write(pairName + " : " +pairValue );
-
</สคริปต์>
คุณยังคิดว่า HTML ไม่มีสถานะอยู่หรือไม่
33 เปิดวัตถุเอกสารใหม่
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
ฟังก์ชั่น newDocument() {
เอกสาร.เปิด();
document.write(“<p>นี่คือเอกสารใหม่</p>”);
เอกสาร.ปิด();
-
</script>
ข้ามไป 34 หน้า
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
window.location = “http://www.x-force.cn/”;
</script>
35 เพิ่มหน้าต่างความคืบหน้าในการโหลดหน้าเว็บ
โค้ดโปรแกรมเนื้อหาอ้างอิง
<html>
<หัว>
<script language='javaScript'>
var placeHolder = window.open('holder.html','placeholder','width=200,height=200');
</สคริปต์>
<title>หน้าหลัก</title>
</หัว>
<body onLoad='placeHolder.close()'>
<p>นี่คือหน้าหลัก</p>
</ร่างกาย>
</html>
เพียงเท่านี้สำหรับ JavaScript 3: รูปภาพ
36 การอ่านแอตทริบิวต์รูปภาพ
โค้ดโปรแกรมเนื้อหาอ้างอิง
<img src="/”image1.jpg"” name="myImage">
<a href=”# ” onClick=”window.alert(document.myImage.width)”>ความกว้าง</a>
37 กำลังโหลดรูปภาพแบบไดนามิก
รหัสโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
myImage = รูปภาพใหม่;
myImage.src = “Tellers1.jpg”;
</script>
38 การเปลี่ยนรูปภาพอย่างง่าย
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
rollImage = รูปภาพใหม่;
rollImage.src = “rollImage1.jpg”;
defaultImage = รูปภาพใหม่;
defaultImage.src = “image1.jpg”;
</สคริปต์>
<a href="/"myUrl"" onMouseOver="document.myImage.src = rollImage.src;"
onMouseOut=”document.myImage.src = defaultImage.src;”>
<img src="/"image1.jpg"" name="myImage" width=100 height=100 border=0>
39 การแสดงรูปภาพแบบสุ่ม
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var imageList = อาร์เรย์ใหม่;
imageList[0] = "image1.jpg";
imageList[1] = "image2.jpg";
imageList[2] = "image3.jpg";
imageList[3] = "image4.jpg";
var imageChoice = Math.floor(Math.random() * imageList.length);
document.write('<img src="' + imageList[imageChoice] + '">');
</script>
40 การแทนที่รูปภาพที่ดำเนินการโดยฟังก์ชัน
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
แหล่งที่มา var = 0;
การแทนที่ var = 1;
ฟังก์ชั่น createRollOver (ภาพต้นฉบับ, ภาพทดแทน) {
var imageArray = อาร์เรย์ใหม่;
imageArray[source] = รูปภาพใหม่;
imageArray[แหล่งที่มา].src = รูปภาพต้นฉบับ;
imageArray[แทนที่] = รูปภาพใหม่;
imageArray[แทนที่].src = replacementImage;
กลับรูปภาพอาร์เรย์;
-
var rollImage = createRollOver("image1.jpg","rollImage1.jpg");
</สคริปต์>
<a href=”#” onMouseOver=”document.myImage1.src = rollImage1[แทนที่].src;”
onMouseOut=”document.myImage1.src = rollImage1[แหล่งที่มา].src;”>
<img src="/"image1.jpg"" width=100 name="myImage1" border=0>
</a>
41 สร้างสไลด์โชว์
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var imageList = อาร์เรย์ใหม่;
imageList[0] = รูปภาพใหม่;
imageList[0].src = “image1.jpg”;
imageList[1] = รูปภาพใหม่;
imageList[1].src = “image2.jpg”;
imageList[2] = รูปภาพใหม่;
imageList[2].src = “image3.jpg”;
imageList[3] = รูปภาพใหม่;
imageList[3].src = “image4.jpg”;
ฟังก์ชั่นสไลด์โชว์ (หมายเลขรูปภาพ) {
document.slideShow.src = imageList[imageNumber].src;
รูปภาพหมายเลข += 1;
ถ้า (imageNumber < imageList.length) {
window.setTimeout("slideShow(" + imageNumber + ")",3000);
-
-
</สคริปต์>
</หัว>
<body onLoad="slideShow(0)">
<img src="/”image1.jpg"” width=100 name=”slideShow”>
รูปภาพโฆษณาแบบสุ่ม 42 ภาพ
รหัสโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var imageList = อาร์เรย์ใหม่;
imageList[0] = "image1.jpg";
imageList[1] = "image2.jpg";
imageList[2] = "image3.jpg";
imageList[3] = "image4.jpg";
var urlList = อาร์เรย์ใหม่;
urlList[0] = "http://some.host/";
urlList[1] = "http://another.host/";
urlList[2] = "http://somewhere.else/";
urlList[3] = "http://right.here/";
var imageChoice = Math.floor(Math.random() * imageList.length);
document.write('<a href="' + urlList[imageChoice] + '"><img src="' + imageList[imageChoice] + '"></a>');
</script>
เพียงเท่านี้สำหรับ JavaScript 4: การ
จัดองค์ประกอบแบบฟอร์ม 43
โค้ดโปรแกรมเนื้อหาอ้างอิง
<form method=”post” action=”target.html” name=”thisForm”>
<ประเภทอินพุต=”ข้อความ” ชื่อ=”myText”>
<select name="mySelect">
<option value="1">ตัวเลือกแรก</option>
<option value=”2”>ตัวเลือกที่สอง</option>
</เลือก>
<br>
<ประเภทอินพุต =”ส่ง” value=”ส่งฉัน”>
</form>
44 เข้าถึงเนื้อหากล่องข้อความในแบบฟอร์ม
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ชื่อแบบฟอร์ม = "myForm">
<ประเภทอินพุต=”ข้อความ” ชื่อ=”myText”>
</แบบฟอร์ม>
<a href='#' onClick='window.alert(document.myForm.myText.value);'>ตรวจสอบฟิลด์ข้อความ</a>
45 คัดลอกเนื้อหากล่องข้อความแบบไดนามิก
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ชื่อแบบฟอร์ม = "myForm">
ป้อนข้อความ: <input type=”text” name=”myText”><br>
คัดลอกข้อความ: <input type=”text” name=”copyText”>
</แบบฟอร์ม>
<a href=”#” onClick=”document.myForm.copyText.value =
document.myForm.myText.value;”>คัดลอกฟิลด์ข้อความ</a>
46 ตรวจจับการเปลี่ยนแปลงในกล่องข้อความ
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ชื่อแบบฟอร์ม = "myForm">
ป้อนข้อความ: <input type=”text” name=”myText” onChange=”alert(this.value);”>
</form>
47 เข้าถึงการเลือกที่เลือก
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ชื่อแบบฟอร์ม = "myForm">
<select name="mySelect">
<option value=”ตัวเลือกแรก”>1</option>
<option value=”ตัวเลือกที่สอง”>2</option>
<option value=”ตัวเลือกที่สาม”>3</option>
</เลือก>
</แบบฟอร์ม>
<a href='#' onClick='alert(document.myForm.mySelect.value);'>ตรวจสอบรายการการเลือก</a>
48 เพิ่มรายการที่เลือกแบบไดนามิก
รหัสโปรแกรมเนื้อหาอ้างอิง
<ชื่อแบบฟอร์ม = "myForm">
<select name="mySelect">
<option value=”ตัวเลือกแรก”>1</option>
<option value=”ตัวเลือกที่สอง”>2</option>
</เลือก>
</แบบฟอร์ม>
<ภาษาสคริปต์ = "จาวาสคริปต์">
document.myForm.mySelect.ความยาว++;
document.myForm.mySelect.options[document.myForm.mySelect.length - 1].text = “3”;
document.myForm.mySelect.options[document.myForm.mySelect.length - 1].value = “ตัวเลือกที่สาม”;
</script>
49 ตรวจสอบฟิลด์แบบฟอร์ม
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
ฟังก์ชั่น checkField (ฟิลด์) {
ถ้า (field.value == "") {
window.alert("คุณต้องระบุค่าในช่อง");
สนาม.โฟกัส();
-
-
</สคริปต์>
<ชื่อแบบฟอร์ม = "myForm" action = "target.html">
ช่องข้อความ: <input type="text" name="myField" onBlur="checkField(this)">
<br><ประเภทอินพุต=”ส่ง”>
</form>
50 ตรวจสอบ เลือกรายการ
โค้ดโปรแกรมเนื้อหาอ้างอิง
รายการตรวจสอบฟังก์ชัน (การเลือก) {
ถ้า (selection.length == 0) {
window.alert("คุณต้องทำการเลือกจากรายการ");
กลับเท็จ;
-
กลับเป็นจริง;
}
51 เปลี่ยนการกระทำของแบบฟอร์มแบบไดนามิก
โค้ดโปรแกรมเนื้อหาอ้างอิง
<form name="myForm" action="login.html">
ชื่อผู้ใช้: <input type=”text” name=”username”><br>
รหัสผ่าน: <input type=”password” name=”password”><br>
<ประเภทอินพุต =”ปุ่ม” ค่า =”เข้าสู่ระบบ” onClick=”this.form.submit();”>
<input type="button" value="ลงทะเบียน" onClick="this.form.action = 'register.html'; this.form.submit();">
<input type="button" value="ดึงรหัสผ่าน" onClick="this.form.action = 'password.html'; this.form.submit();">
</form>
52 การใช้ปุ่มรูปภาพ
โค้ดโปรแกรมเนื้อหาอ้างอิง
<form name="myForm" action="login.html">
ชื่อผู้ใช้: <input type=”text” name=”username”><br>
รหัสผ่าน: <input type=”password” name=”password”><br>
<input type="image" src="/"login.gif"" value="เข้าสู่ระบบ">
</form>
53 การเข้ารหัสข้อมูลแบบฟอร์ม
โค้ดโปรแกรมเนื้อหาอ้างอิง
<SCRIPT LANGUAGE='จาวาสคริปต์'>
-
ฟังก์ชั่นเข้ารหัส (รายการ) {
var newItem = '';
สำหรับ (i=0; i < item.length; i++) {
newItem += item.charCodeAt(i) + '.';
-
กลับรายการใหม่;
-
ฟังก์ชั่น encryptForm (myForm) {
สำหรับ (i=0; i < myForm.elements.length; i++) {
myForm.elements[i].value = เข้ารหัส(myForm.elements[i].value);
-
}
//-->
</สคริปต์>
<form name='myForm' onSubmit='encryptForm(this); window.alert(this.myField.value);'>
ป้อนข้อความบางส่วน: <input type=text name=myField><input type=submit>
</form>
เพียงเท่านี้สำหรับ JavaScript 5: หน้าต่างและเฟรม
54 เปลี่ยนข้อความแจ้งแถบสถานะของเบราว์เซอร์
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
window.status = “ข้อความสถานะใหม่”;
</script>
55 กล่องข้อความยืนยันป๊อปอัป
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var userChoice = window.confirm(“คลิกตกลงหรือยกเลิก”);
ถ้า (ตัวเลือกผู้ใช้) {
document.write(“คุณเลือกตกลง”);
} อื่น {
document.write("คุณเลือกยกเลิก");
-
</script>
56 คำสั่งให้ป้อนข้อมูล
รหัสโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var userName = window.prompt("กรุณากรอกชื่อของคุณ", "กรอกชื่อของคุณที่นี่");
document.write("ชื่อของคุณคือ" + ชื่อผู้ใช้);
</script>
57 เปิดหน้าต่างใหม่
เนื้อหาที่ยกมา //เปิดรหัสโปรแกรมหน้าต่างเบราว์เซอร์ใหม่ชื่อ myNewWindow
<ภาษาสคริปต์ = "จาวาสคริปต์">
window.open("http://www.liu21st.com/", "myNewWindow");
</script>
58 กำหนดขนาดของหน้าต่างใหม่
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
window.open("http://www.liu21st.com/", "myNewWindow",'height=300,width=300');
</script>
59 กำหนดตำแหน่งของหน้าต่างใหม่
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
window.open("http://www.liu21st.com/", "myNewWindow",'height=300,width=300,left=200,screenX=200,top=100,screenY=100');
</script>
60 ว่าจะแสดงแถบเครื่องมือและแถบเลื่อนหรือไม่
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
window.open("http://www.x-force.cn/",แถบเครื่องมือ=no, แถบเมนู=no);
</script>
61 เป็นไปได้ไหมที่จะขยายขนาดของหน้าต่างใหม่?
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
window.open('http://www.x-force.cn/', 'myNewWindow', 'resizable=yes' );</script>
62 โหลดเอกสารใหม่ลงในหน้าต่างปัจจุบัน
โค้ดโปรแกรมเนื้อหาอ้างอิง
<a href='#' onClick='document.location = '125a.html';' >เปิดเอกสารใหม่</a>
63 กำหนดตำแหน่งการเลื่อนของหน้า
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
if (document.all) { //หากเป็นเบราว์เซอร์ IE ให้ใช้แอตทริบิวต์ scrollTop
document.body.scrollTop = 200;
} else { //หากเป็นเบราว์เซอร์ NetScape ให้ใช้แอตทริบิวต์ pageYOffset
หน้าต่าง.pageYOffset = 200;
}</script>
64 เปิดหน้าต่างแบบเต็มหน้าจอใน IE
โค้ดโปรแกรมเนื้อหาอ้างอิง
<a href='#' onClick=”window.open('http://www.devdao.com/','newWindow','fullScreen=yes');”>เปิดหน้าต่างแบบเต็มหน้าจอ</a>
65 การทำงานของหน้าต่างใหม่และหน้าต่างหลัก
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
//กำหนดหน้าต่างใหม่
var newWindow = window.open("128a.html","newWindow");
newWindow.close(); //ปิดหน้าต่างใหม่ที่เปิดอยู่ในหน้าต่างหลัก
</script>ปิดรหัสโปรแกรมหน้าต่างหลักในหน้าต่างใหม่
window.opener.close()
66 เขียนเนื้อหาไปยังหน้าต่างใหม่
โค้ดโปรแกรมเนื้อหาอ้างอิง
<ภาษาสคริปต์ = "จาวาสคริปต์">
var newWindow = window.open("", "newWindow");
newWindow.document.open();
newWindow.document.write("นี่คือหน้าต่างใหม่");
newWIndow.document.close();
</script>
67 โหลดเพจลงในเพจเฟรม
โค้ดโปรแกรมเนื้อหาอ้างอิง
<frameset cols=”50%,*”>
<frame name="frame1" src="/"135a.html"">
<frame name="frame2" src="/"about:blank"">
</เฟรมเซต>
โหลดเพจใน frame2 ใน frame1
parent.frame2.document.location = “135b.html”;
68 การแชร์สคริปต์ระหว่างเพจเฟรม
การอ้างอิงเนื้อหา หากมีโค้ดสคริปต์ในไฟล์ html ใน frame1
ฟังก์ชั่น doAlert() {
window.alert(“โหลดเฟรม 1 แล้ว”);
-
โค้ดโปรแกรม
เมธอดสามารถเรียกได้เช่นนี้ใน frame2
<body onLoad="parent.frame1.doAlert();">
นี่คือเฟรมที่ 2
</body>
69 ข้อมูลสาธารณะ
เนื้อหาอ้างอิงสามารถกำหนดรายการข้อมูลในหน้าเฟรมเพื่อให้โค้ดยูทิลิตีเพจสามารถใช้ข้อมูลในหลายเฟรมได้
<ภาษาสคริปต์ = "จาวาสคริปต์">
var resistVariable = “นี่คือค่าถาวร”;
</สคริปต์>
<frameset cols=”50%,*”>
<frame name="frame1" src="/"138a.html"">
<frame name="frame2" src="/"138b.html"">
</frameset>
ด้วยวิธีนี้ตัวแปร PersentVariable สามารถใช้ได้ทั้ง frame1 และ frame2
70 Framework Code Library
เนื้อหาที่ยกมา ตามแนวคิดข้างต้น เราสามารถใช้เพจเฟรมที่ซ่อนอยู่เป็น
โค้ด
โปรแกรมฐานโค้ดของชุดเฟรมทั้งหมด
<เฟรมเซ็ตคอล=”0,50%,*”>
<frame name="codeFrame" src="/"140code.html"">
<frame name="frame1" src="/"140a.html"">
<frame name="frame2" src="/"140b.html"">
</เฟรมเซต>