Working with  Links

ในบทนี้คุณจะได้เรียนรู้ว่าจะใช้ JavaScript สนับสนุน links ได้อย่างไร จะใช้ location load ข้อมูลจาก URLs ที่กำหนดได้อย่างไร จะใส่ JavaScript ลงใน links ของเอกสารได้อย่างไร จะใช้ history เก็บข้อมูลของ URLs ที่ผู้ใช้ผ่านมาได้อย่างไร

URLs
Universal resource locator หรือ URLs เนี่ย เป็นมาตรฐานของ Address ต่างๆใน Internet เวลาคุณต้องการจะไปที่ไหน คุณก็ต้องพิมพ์ URLs ลงไปในช่อง Address ของ Browser ทีนี้ ก่อนที่เราจะศึกษา JavaScript เรามาศึกษารายละเอียดของการใช้ URLs กันก่อนดีไหมครับ

URLs ส่วนใหญ่จะอยู่ในรูปแบบนี้ครับ :
protocol//hostname[:port] path search hash
@protocol เป็นวิธีการในการขอการบริการใน Internet เช่น http:,ftp:,mailto: และ file: และคุณจะได้ศึกษา Protocol ของ JavaScript เพิ่มเติมในบทนี้ครับ
@hostname ก็คือชื่อเต็มของ host ที่มีเราติดต่อไปเช่น www.microsoft.com หรือ www.sanook.com
@port เป็นการกำหนดหมายเลข TCP port ที่จะใช้กับ Protocol ตัวอย่าง port ที่เรารู้จักดีก็เช่น port 80 ของ http:
@pathคือ ไดเรกทอรีของข้อมูล วิธีเขียน slash จะใช้ตามแบบ UNIX เช่น /pentagon/2932/index.html
@searchเป็นส่วนที่ CGI ของ search engine ต่างๆเพิ่มให้เรา (ลองไป search ใน Yahoo ดูสิครับ จะได้เห็น URL แปลกๆ นั่นแหละ ใช่เลย)
@hashเป็นชื่อ URLs ที่ถูกกำหนดใน file ทำให้สามารถ links ไปยังจุดต่างๆในหน้าเดียวกันได้ (มักใช้กับ Webpage ยาวๆ) เครื่องหมายของ hash ก็คือ # เช่น #section3
The javascript:  and about:  Protocols
นอกจาก Protocols ทั่วไปแล้ว JavaScript ยังมี Protocols ให้ใช้อีก 2 ตัวคือ javascript: และ about:

javascript:Date() จะแสดงวันที่ และเวลาปัจจุบัน (ลองดูสิครับ พิมพ์ลงไปในช่อง Adderss)
javascript:void(0) ใช้ทำตัว links ที่ไม่ links ไปไหน

ถ้าคุณใช้ Netscape ลองพิมพ์ตามนี้ลงใน ช่อง Adress นะครับ
javascript:"<H1>"+"What's up?"+"</H1>"
จะเห็นว่าสามารถแสดงผลคำว่า What's up? ใน H1 ได้เลย แต่ใน IE ทำไม่ได้ครับ เพราะ Netscape สนับสนุน JavaScirpt มากกว่า

about: จะแสดงรายละเอียดของ navigater (ใช้ได้กับ netscape เท่านั้น)
about:cache จะแสดงรายละเอียดของ cache (ใช้ได้กับ netscape เท่านั้น)
about:plugins จะแสดงรายละเอียดของ plug-ins (ใช้ได้กับ netscape เท่านั้น)

The  Location  Object
location จะให้ค่าต่างๆของ document ปัจจุบันที่สดงบน window และ location ไม่อนุญาติ ให้คุณ set ค่าต่างๆ ใน Properties (เป็น read-only)
การอ้างถึง location ให้มอง locatiion เป็น Property ของ document ครับ
document.location

Properties ของ location มีดังนี้ครับ

	เป็นจุด links ของ URL (ถ้ามีนะ)
	แสดง hostname:port ของ URL
	hostname ของ URL
	URL เต็ม
	ส่วน pathname ของ URL
	ส่วน port ของ URL
	ส่วน protocol ของ URL
	ส่วน search ของ URL

location มี methods อยู่ 2 ตัวคือ reload() และ replace() ครับ
reload() ใช้ reload ข้อมูลจาก Webpage
replace() ใช้ load ข้อมูลจาก URL ที่กำหนด
ตัวอย่างการใช้ครับ

The  Link  Object
Link ก็คือ ภาพหรือ ข้อความที่ click แล้วจะพาคุณไปโผล่อีกที่หนึ่ง Propertiesต่างๆของ link ก็จะเป็นข้อมูลของเป้าหมายที่คุณจะไป Properties ต่างๆจึงเหมือนกับ location เปี๊ยบเลยครับ ต่างกันแค่ location เป็นข้อมูลของ หน้าปัจจุบัน แต่ link เป็นข้อมูลของเป้าหมายเท่านั้นเองครับ

ในการใช้ link คุณควรกำหนดชื่อ link เอาไว้ด้วยเพื่อให้อ่างถึงได้ง่ายเช่น document.LinkToSanook

links มี Event 3 ตัวครับ : onclick onmouseover onmouseout คุณคงรู้จักใน บท Event แล้วนะครับ Event ของ link เนี่ยใช้หากินได้เยอะนะ จำให้ดีล่ะ

The  Link()  Method
Link Object ไม่ใช้วิธีเดียวที่จะสร้าง Link link เนี่ย อาจจะสร้างจาก link() Method ได้ด้วย ถ้าผมเขียน code นี้