ใน HTML 4.0 Strict และ XHTML 1.0 STRICT ไม่อนุญาตให้ใช้แอตทริบิวต์เป้าหมายในแท็ก <a> ซึ่งเป็นเรื่องที่น่าหงุดหงิดสำหรับนักออกแบบเว็บไซต์ ยังคงได้รับอนุญาตให้ใช้ในข้อกำหนดเฉพาะเฉพาะกาล แต่ด้วยวิธีการบางอย่าง เราสามารถแก้ไขปัญหานี้ได้
คุณลักษณะเป้าหมายถูกลบออกจากข้อกำหนด HTMl4.0 แต่เพิ่มแอตทริบิวต์อื่น: rel แอ็ตทริบิวต์นี้ใช้เพื่อระบุความสัมพันธ์ระหว่างเอกสารที่มีลิงก์และเอกสารที่ลิงก์ ค่าแอตทริบิวต์ (เช่น: ถัดไป, ก่อนหน้า, บท, ส่วน) ถูกกำหนดไว้ในข้อกำหนด คุณลักษณะเหล่านี้ส่วนใหญ่ใช้เพื่อกำหนดความสัมพันธ์ระหว่างส่วนเล็กๆ ของเอกสารขนาดใหญ่ ในความเป็นจริงข้อกำหนดดังกล่าวช่วยให้นักพัฒนาสามารถใช้ค่าคุณสมบัติที่ไม่ได้มาตรฐานสำหรับแอปพลิเคชันเฉพาะได้อย่างอิสระ
ที่นี่ เราใช้ค่าที่กำหนดเองภายนอกสำหรับแอตทริบิวต์ rel เพื่อทำเครื่องหมายลิงก์เพื่อเปิดหน้าต่างใหม่
รหัสลิงค์ที่ไม่สอดคล้องกับมาตรฐานเว็บล่าสุด:
<a href="document.html" target="_blank">ลิงก์ภายนอก</a>
ใช้แอตทริบิวต์ rel:
<a href="document.html" rel="external">ลิงก์ภายนอก</a>
ตอนนี้เราได้สร้างลิงก์ไปยังหน้าต่างใหม่ที่สอดคล้องกับมาตรฐานเว็บแล้ว เราจำเป็นต้องใช้ JavaScript เพื่อใช้งานหน้าต่างใหม่ด้วย สิ่งที่สคริปต์ต้องการทำคือค้นหาไฮเปอร์ลิงก์ทั้งหมดในเอกสารที่เรากำหนดเป็น rel="external" เมื่อโหลดหน้าเว็บ
ก่อนอื่นเราต้องกำหนดเบราว์เซอร์
ถ้า (!document.getElementsByTagName) กลับมา;
getElementsByTagName เป็นวิธีการที่ใช้งานง่ายในมาตรฐาน DOM1 และขณะนี้เบราว์เซอร์ส่วนใหญ่รองรับ เนื่องจากเบราว์เซอร์รุ่นเก่าบางรุ่น เช่น Netscape 4 และ IE4 ไม่รองรับ DOM1 เราจึงต้องแยกแยะออกด้วยการพิจารณาว่าวิธีนี้มีอยู่หรือไม่ เบราว์เซอร์เวอร์ชันเก่าเหล่านี้
ต่อไป เราได้รับแท็ก <a> ทั้งหมดในเอกสารผ่านเมธอด getElementsByTagName:
จุดยึด var = document.getElementsByTagName("a");
Anchors ถูกกำหนดให้เป็นอาร์เรย์ที่มีแต่ละแท็ก <a> ตอนนี้เราต้องวนซ้ำแต่ละแท็ก <a> และแก้ไข:
สำหรับ (var i=0; i < anchors.length; i++) {
var สมอ = จุดยึด;
ค้นหาแท็ก <a> ที่คุณต้องการเปิดหน้าต่างใหม่
ถ้า (anchor.getAttribute("href") &&
anchor.getAttribute("rel") == "ภายนอก")
ถัดไป สร้างเป้าหมายค่าแอตทริบิวต์และกำหนดค่า "_target"
สมอ.เป้าหมาย = "_blank",
รหัสที่สมบูรณ์:
ฟังก์ชั่น externalLinks() {
ถ้า (!document.getElementsByTagName) กลับมา;
จุดยึด var = document.getElementsByTagName("a");
สำหรับ (var i=0; i<anchors.length; i++) {
var สมอ = จุดยึด;
ถ้า (anchor.getAttribute("href") &&
anchor.getAttribute("rel") == "ภายนอก")
สมอ.เป้าหมาย = "_blank";
-
-
window.onload = ลิงค์ภายนอก;