เมื่อเราต้องการเปิดลิงค์ในหน้าต่างใหม่ วิธีปกติคือเพิ่ม target="_blank" หลังลิงค์ ไม่มีปัญหาเมื่อเราใช้ transitional DOCTYPE (xh tml1-transitional.dtd) แต่เมื่อเราใช้ DOCTYPE ที่เข้มงวด (xhtml1- strict.dtd) วิธีการนี้จะล้มเหลวในการตรวจสอบ W3C และข้อความแสดงข้อผิดพลาดต่อไปนี้จะปรากฏขึ้น:
"ไม่มีเป้าหมายแอตทริบิวต์สำหรับองค์ประกอบนี้ (ในเวอร์ชัน HTML นี้)"
ปรากฎว่าภายใต้ DOCTYPE ที่เข้มงวดของ HTML4.01/XHTML1.0/XHTML1.1, target="_blank", target="_self" และไวยากรณ์อื่นๆ นั้นไม่ถูกต้อง และเราสามารถใช้งานได้ผ่าน JavaScript เท่านั้น
เพื่อนถามว่าทำไม target="_blank" ถึงห้ามใช้? คุณลักษณะนี้สะดวกมาก ฮ่าๆ ฉันไม่รู้ว่าผู้เชี่ยวชาญของ W3C คิดอย่างไร เท่าที่ฉันรู้ ส่วนใหญ่เกี่ยวกับ “ความง่ายในการใช้งานและความเป็นมิตร” เพราะชาวต่างชาติคิดว่ามันไม่สุภาพที่จะเปิดหน้าต่างใหม่โดยไม่ได้รับความยินยอมจากผู้ใช้หรือการแจ้งเตือนที่ชัดเจน ของ. ไม่ว่าการยกเลิกนี้จะสมเหตุสมผลหรือไม่ก็ตาม เรามาดูวิธีแก้ปัญหากัน
แอตทริบิวต์ rel
HTML4.0 เพิ่มแอตทริบิวต์ใหม่: rel คุณลักษณะนี้ใช้เพื่ออธิบายความสัมพันธ์ระหว่างลิงก์และหน้าเว็บที่มีลิงก์ ตลอดจนเป้าหมายของลิงก์ rel มีค่าแอตทริบิวต์มากมาย เช่น ถัดไป ก่อนหน้า บท ส่วน เป็นต้น สิ่งที่เราต้องการใช้คือแอตทริบิวต์ rel="externa l" รหัสต้นฉบับเขียนดังนี้:
<a href="document.html" target="_blank"> เปิดหน้าต่างใหม่</a>
ตอนนี้จะเขียนแบบนี้:
<a href="document.html" rel="external">เปิดหน้าต่างใหม่</a>
นี่เป็นวิธีการที่เข้มงวด แน่นอนว่าจะต้องใช้ร่วมกับจาวาสคริปต์จึงจะมีประสิทธิภาพ
รหัส JS ที่สมบูรณ์ของจาวาสคริปต์มีดังนี้:
ฟังก์ชั่นลิงก์ภายนอก () {
ถ้า (!document.getElementsByTagName) กลับมา;
จุดยึด var = document.getElementsByTagName("a");
สำหรับ (var i=0; i<anchors.length; i++) {
var สมอ = จุดยึด [i];
ถ้า (anchor.getAttribute("href") &&
anchor.getAttribute("rel") == "ภายนอก")
สมอ.เป้าหมาย = "_blank";
-
-
window.onload = ลิงก์ภายนอก;
คุณสามารถบันทึกเป็นไฟล์ .js (เช่น external.js) และเรียกมันผ่านวิธีการเชื่อมต่อภายนอก:
<script type="text/javascript" src="external.js"></script>
แค่นั้นแหละ.
สุดท้ายนี้ ฉันอยากจะเสริมว่า target="new" ที่เว็บไซต์ของฉันใช้นั้นได้รับอนุญาตภายใต้ DOCTYPE เฉพาะกาล แต่ไม่เป็นไปตามมาตรฐานที่เข้มงวด ฉันจะใช้โหมดเข้มงวดในการแก้ไขครั้งต่อไปและเปลี่ยน target="new" ทั้งหมดเป็น rel="external"