เชื่อมโยงไปเว็บเพจหน้าอื่น

การเชื่อมโยงข้อมูลไปเว็บเพจหน้าอื่น ที่อยู่ในเว็บไซต์เดียวกัน

        ถ้าเราต้องการเชื่อมโยงเว็บเพจจากหน้าหนึ่งไปยังหน้าเว็บเพจอื่นที่อยู่ในเว็บไซต์เดียวกัน เช่นเรามีเว็บเพจอยู่จำนวน 3 หน้าที่ต้องการเชื่อมโยงถึงกัน สามารถทำได้ดังนี้

ตัวอย่างการเชื่อมโยงกับเว็บเพจหน้าอื่น

<body>

<img src=s.jpg>

สตีเวน พอล จอบส์ หรือที่รู้จักในชื่อ สตีฟ จอบส์ เป็นผู้นำธุรกิจและนักประดิษฐ์ชาวอเมริกัน ผู้ร่วมก่อตั้ง ประธาน   อดีตประธานบริหารของแอปเปิลคอมพิวเตอร์

 <a href="p1.html"> คลิกอ่านต่อ </a>

<br>

<img src=b.jpg>

วิลเลียม เฮนรี เกตส์ ที่สาม หรือที่มักเป็นที่รู้จักในชื่อ บิล เกตส์ เป็นนักธุรกิจชาวอเมริกัน และหนึ่งในผู้ก่อตั้งบริษัทไมโครซอฟท์

<a href="p2.html"> คลิกอ่านต่อ </a>

</body>

        ลอง ดาวน์โหลด ไฟล์ linkpage.rar ที่อยู่ด้านล่างสุดไปศึกษาเพิ่มเติมครับ

ผลลัพธ์ที่ได้

ทำความเข้าใจ

        การเชื่อมโยงเว็บเพจแบบนี้เราเรียกว่าการเชื่อมโยงแบบ Relative Path Names ซึ่งเป็นวิธีที่นิยมใช้ในการเชื่อมโยงไฟล์เว็บเพจ โดยมีหลักการดังนี้

    1. กรณีเว็บเพจอยู่ในไดเรกทอรี่เดียวกัน

            สามารถเชื่อมโยงโดยใช้แท็ก <a href…> พิมพ์ชื่อเว็บเพจที่ต้องการลงไปได้เลย เช่น

<a href=“page1.html”> ประวัติ สตีฟ จอบส์  </a>

<a href=“page2.html”> ประวัติ บิล เกตส์  </a>

ตัวอย่างการเขียนโปรแกรมเชื่อมโยงกับหน้าเว็บเพจอื่น ที่ไฟล์ "home.html"

    2. กรณีเว็บเพจที่จะเชื่อมโยงอยู่ในไดเร็กทอรี่ที่ต่ำกว่า

            เราสามารถใช้ <a href…> แล้วอ้างอิงตำแหน่งของเว็บปลายทางตั้งแต่เริ่มต้นจนถึงปลายทางเช่น

<a href=“web1/page1.html”> ประวัติ สตีฟ จอบส์  </a>

<a href=“web1/page2.html”> ประวัติ บิล เกตส์  </a>

ตัวอย่างการเขียนโปรแกรมเชื่อมโยงกับหน้าเว็บเพจอื่น ที่ไฟล์ "home.html"

    3. กรณีเว็บเพจที่จะเชื่อมโยงอยู่ในไดเรกทอรี่ที่สูงกว่า

            ถ้าเว็บเพจปลายทางอยู่ในไดเรกทอรีที่อยู่สูงกว่าสามารถกำหนดได้ดังนี้

<a href=“../page1.html”> ประวัติ สตีฟ จอบส์ </a>

<a href=“../page2.html”> ประวัติ บิล เกตส์ </a>

ตัวอย่างการเขียนโปรแกรมเชื่อมโยงกับหน้าเว็บเพจอื่น ที่ไฟล์ "home.html"

        จากตัวอย่างจะเห็นว่า เราจะใช้เครื่องหมาย “..” ในการอ้างอิง ไปยังไดเรกทอรี่ที่อยู่สูงกว่า ถ้าอยู่สูงกว่า 1 ระดับ เราก็จะใช้เครื่องหมาย “..” 1 ครั้ง แต่ถ้าสูงกว่า 2 ระดับ เราก็จะใช้เครื่องหมาย “..” 2 ครั้ง ด้วยกัน