การเชื่อมโยงข้อมูล ตอนที่1

คําสั่งที่ใช้ในการเชื่อมโยง <a href="Target">...</a>

ในการใช้คำสั่งเพื่อเชื่อมโยงข้อมูลนั้น เราสามารถระบุถึงจุดหมายได้โดยใช้คำสั่ง anchor ( <a> ... </a>) ร่วมกับแอตทริบิวต์ HREF (ย่อมาจากคำว่า Hypertext REFerance) ซึ่งทำหน้าที่ระบุเป้าหมาย (Target) โดยที่เป้าหมายคือ ตำแหน่งปลายทางของการเชื่อมโยงข้อมูล

ตัวอย่าง

Source View

<html>
<head>
<title>Link </title>
</head>
<body>
<a href="indexhtml.htm">This is Hypertext links</a>
</body>
</html>
This is Hypertext links

ประเภทของการเชื่อมโยง
HTML แบ่งการเชื่อมโยงออกเป็น 2 ประเภท ดังนี้

การเชื่อมโยงภายในเว็บไซต์
การเชื่อมโยงภายนอกเว็บไซต์

การเชื่อมโยงทั้ง 2 ประเภทนี้ ยังแบ่งออกได้เป็น 2 ชนิด คือการเชื่อมโยงข้อมูลภายในแฟ้มเอกสาร และการเชื่อมโยงข้อมูลต่างแฟ้มเอกสาร

การเชื่อมโยงภายในแฟ้มเอกสาร

เหมาะสำหรับใช้กับเอกสารที่มีความยาวมากๆ ใช้สำหรับเชื่อมโยงข้อมูล จากจุดหนึ่งไปยังอีกจุดหนึ่งภายในแฟ้มเอกสารเดียวกัน สำหรับการใช้การเชื่อมโยงภายในแฟ้มเอกสารทำได้ดังนี้ :

<a href=#เป้าหมาย> Link </a>
.. ข้อความ เนื้อหาต่างๆ ..
<a name=ชื่อเป้าหมาย</a>

ตัวอย่าง

Source

View

<html>
<head>
<title>Link </title>
</head>
<body>
<a href=#1> 1 goto "Every night in...."</a> 
<a href=#2> 2 goto "Near far...."</a> 

Song: My Heart Will Go On - Celine Dion 

BY: Celine Dion 

<a name=1>
Every night in my dreams 
I see you, I feel you, 
That is how I know you go on. 
Far across the distance 
And spaces between us 
You have come to show you go on. 

Near, far, wherever you are 
I believe that the heart does go on. 
Once more you open the door 
And you're here in my heart, 
And my heart will go on and on. 
Love can touch us one time 
And last for a lifetime. 
And never let go till we're gone. 
Love was when I loved you, 
One true time I hold to, 
In my life we'll always go on. 

<a name=2>
Near, far, wherever you are, 
I believe that the heart does go on. 
Once more you open the door 
And you're here in my heart. 

And my heart will go on and on. 
You're here, there's nothing I fear, 
And I know that my heart will go on 
We'll stay forever this way, 
You are safe in my heart 
And my heart will go on and on

</body>
</html>

1 goto "Every night in...."
2 goto "Near far...."

Song: My Heart Will Go On - Celine Dion

BY: Celine Dion

Every night in my dreams
I see you, I feel you,
That is how I know you go on.
Far across the distance
And spaces between us
You have come to show you go on.

Near, far, wherever you are
I believe that the heart does go on.
Once more you open the door
And you're here in my heart,
And my heart will go on and on.
Love can touch us one time
And last for a lifetime.
And never let go till we're gone.
Love was when I loved you,
One true time I hold to,
In my life we'll always go on.

Near, far, wherever you are,
I believe that the heart does go on.
Once more you open the door
And you're here in my heart.

And my heart will go on and on.
You're here, there's nothing I fear,
And I know that my heart will go on
We'll stay forever this way,
You are safe in my heart
And my heart will go on and on

NOTE & TIP !!

ในการค้นหาจุดหมายปลายทาง หากโปรแกรมหาตำแหน่งของเป้าหมายไม่พบ การแสดงผลจะกลับไปยังจุดเริ่มต้นของแฟ้มข้อมูลนั้นเสมอ

การเชื่อมโยงต่างแฟ้มเอกสาร

หากเป้าหมายของการเชื่อมโยงระบุเป็นชื่อไฟล์ หรือ อื่นๆ นั้นหมายความว่าเป็นการเชื่อมโยง ข้อมูลนอกแฟ้มเอกสารที่กำลังใช้งานอยู่

การเชื่อมโยงข้อมูลต่างแฟ้มเอกสารยังบ่งออกเป็นการเชื่อมโยงข้อมูลภายในเว็บไซต์ หรือการเชื่อมโยงข้อมูลต่างภายในเว็บไซต์

รุปแบบการเชื่อมโยงภายนอกอย่างง่าย :
<a href=cool.html>Click here to Cool</a>
จากตัวอย่างนี้ จะเป็นการ Link ไปที่ไฟล์ที่ชื่อว่า cool.html

การใช้ได้เรกทอรีกับ HTML นั้น ใช้ตามหลักของระบบ Unix ดังนี้ :

ข้อมูลที่อยู่ในไดเรกทอรีก่อนหน้า 1 ชั้น	เขียนได้ดังนี้	../index.html
ข้อมูลที่อยู่ในไดเรกทอรีก่อนหน้า 2 ชั้น	เขียนได้ดังนี้	../../index.html
ข้อมูลที่อยู่ในไดเรกทอรีอื่นก่อนหน้า 1 ชั้น	เขียนได้ดังนี้	../download/index.html
ข้อมูลที่อยู่ในไดเรกทอรีถัดไป 1 ชั้น	เขียนได้ดังนี้	/plugins/index.html
ข้อมูลที่อยู่ในไดเรกทอรีถัดไป 2 ชั้น	เขียนได้ดังนี้	/download/program/index.html

เช่น <a href=/download/cool.html>Click here to Cool</a>
จากตัวอย่างนี้ จะเป็นการ Link ไปที่ไฟล์ที่ชื่อว่า cool.html ซึ่งอยู่ในไดเรกทอรี่ถัดไปที่ชื่อว่า download

การเชื่อมโยงต่างแฟ้มเอกสารพร้อมกับระบุจุดหมายของแฟ้มปลายทาง
ในการเชื่อมโยงข้อมูลต่างแฟ้มนั้น เราสามารถกำหนดจุดหมายภายในแฟ้มเอกสาร โดยการกำหนดจุดเป้าหมายต่อจากชื่อแฟ้มเอกสาร เช่น<a href=index.html#download>Click here to Download</a>
จากตัวอย่างด้านบนนี้หมายถึง เปิดไฟล์ที่ชื่อ index.html โดยให้ไปที่ download ซึ่งหมายความว่าในไฟล์ index.html คุณต้องกำหนดชื่อจุดหมายก่อน หากยังไม่เข้าเรื่องการกำหนดชื่อจุดหมาย ให้ไปดูที่หัวข้อ
การเชื่อมโยงภายในแฟ้มเอกสาร