Η ιδιότητα target του HTML <a>
Ορισμός και χρήση
target
Η ιδιότητα ορίζει τη θέση ανοίγματος του εγγράφου του συνδέσμου.
Παράδειγμα
Η ιδιότητα target ορίζει τη θέση ανοίγματος του εγγράφου του συνδέσμου:
<a href="https://www.codew3c.com" target="_blank">Επισκεφθείτε το CodeW3C.com</a>
Γλωσσάρισμα
<a target="_blank|_self|_parent|_top|onomasia_plairiou">
target
Η χρήση της ιδιότητας είναι να ενημερώνει τον περιηγητή για το σημείο όπου θέλει να εμφανιστεί το συνδεδεμένο πόρο. Σε προεπιλογή, ο περιηγητής χρησιμοποιεί το παράθυρο, την καρτέλα ή το πλαίσιο (iframe) που εμφανίζει το τρέχον έγγραφο, οπότε το νέο έγγραφο θα αντικαταστήσει το τρέχον έγγραφο που εμφανίζεται, αλλά υπάρχουν και άλλες επιλογές, δείτε την παρακάτω τάβλη.
Αξία ιδιότητας
Αξία | Περιγραφή |
---|---|
_blank | Άνοιγμα του συνδέσμου του εγγράφου σε νέο παράθυρο ή καρτέλα. |
_self | Άνοιγμα του συνδέσμου του εγγράφου στο ίδιο πλαίσιο που κάναμε κλικ (προεπιλεγμένο). |
_parent | Άνοιγμα του συνδέσμου του εγγράφου στο γονικό πλαίσιο. |
_top | Άνοιγμα του συνδέσμου του εγγράφου σε όλο το σώμα του παραθύρου. |
onomasia_plairiou | Άνοιγμα του συνδέσμου του εγγράφου στο καθορισμένο iframe. |
Συμπεριγραφή
Αν περιέχει μια ιδιότητα target μέσα σε ένα σήμα <a>, ο περιηγητής θα φορτώσει και θα εμφανίσει το έγγραφο που ορίζεται από την ιδιότητα href του σήματος, που ταιριάζει με το όνομα του στόχου. Αν το πλαίσιο ή το παράθυρο με το ορισμένο όνομα ή id δεν υπάρχει, ο περιηγητής θα ανοίξει ένα νέο παράθυρο, θα δώσει ένα καθορισμένο σήμα σε αυτό το παράθυρο και θα φορτώσει το νέο έγγραφο σε αυτό το παράθυρο. Από τότε, ο σύνδεσμος του έγγραφου μπορεί να κατευθύνεται προς αυτό το νέο παράθυρο.
Άνοιγμα νέου παραθύρου
Ο σύνδεσμος που κατευθύνεται καθιστά εύκολο τη δημιουργία εργαλείων περιήγησης υψηλής απόδοσης. Για παράδειγμα, μια λίστα με απλά έγγραφα περιεχομένου μπορεί να ανακατευθύνει τα έγγραφα σε ένα ξεχωριστό παράθυρο:
<h3>Table of Contents</h3> <ul> <li><a href="pref.html" target="view_window">Preface</a></li> <li><a href="chap1.html" target="view_window">Chapter 1</a></li> <li><a href="chap2.html" target="view_window">Chapter 2</a></li> <li><a href="chap3.html" target="view_window">Chapter 3</a></li> </ul>
当用户第一次选择内容列表中的某个链接时,浏览器将打开一个新的窗口,将它标记为 "view_window",然后在其中显示希望显示的文档内容。如果用户从这个内容列表中选择另一个链接,且这个 "view_window" 仍处于打开状态,浏览器就会再次将选定的文档载入那个窗口,取代刚才的那些文档。
在整个过程中,这个包含了内容列表的窗口是用户可以访问的。通过单击窗口中的一个连接,可使另一个窗口的内容发生变化。
在框架中打开窗口
不用打开一个完整的浏览器窗口,使用 target 更通常的方法是在一个 <frameset> 显示中将超链接内容定向到一个或者多个框架中。可以将这个内容列表放入一个带有两个框架的文档的其中一个框架中,并用这个相邻的框架来显示选定的文档:
<frameset cols="100,*"> <frame src="toc.html"> <frame src="pref.html" name="view_frame"> </frameset>
当浏览器最初显示这两个框架的时候,左边这个框架包含目录,右边这个框架包含前言。
这是 "toc.html" 的源代码:
<h3>Table of Contents</h3> <ul> <li><a href="pref.html" target="view_frame">Preface</a></li> <li><a href="chap1.html" target="view_frame">Chapter 1</a></li> <li><a href="chap2.html" target="view_frame">Chapter 2</a></li> <li><a href="chap3.html" target="view_frame">Chapter 3</a></li> </ul>
请注意,在文档 "toc.html" 中,每个链接的目标都是 "view_frame",也就是右边的框架。
当用户从左边框架中的目录中选择一个链接时,浏览器会将这个关联的文档载入并显示在右边这个 "view_frame" 框架中。当其他链接被选中时,右边这个框架中的内容也会发生变化,而左边这个框架始终保持不变。
特殊的目标
有 4 个保留的目标名称用作特殊的文档重定向操作:
_blank
Ο browser φορτώνει το στόχο έγγραφο σε ένα νέο παράθυρο που ανοίγει και δεν έχει ονομαστεί.
_self
Αυτός ο στόχος είναι η προεπιλεγμένη τιμή για όλους τους σύνδεσμους <a> που δεν έχουν οριστεί στόχο, φορτώνει το στόχο έγγραφο και το εμφανίζει στο ίδιο πλαίσιο ή παράθυρο με το αρχικό έγγραφο. Αυτός ο στόχος είναι περιττός και δεν είναι απαραίτητος, εκτός αν χρησιμοποιείται με την ιδιότητας target του σήματος <base> του τίτλου του εγγράφου.
_parent
Αυτός ο στόχος φορτώνει το έγγραφο στο γονικό παράθυρο ή στη συλλογή δομών που περιέχει το πλαίσιο που αναφέρεται από τον σύνδεσμο. Αν η αναφορά βρίσκεται στο παράθυρο ή στον κορυφαίο πλαίσιο, τότε είναι ίδιος με τον στόχο _self.
_top
Αυτός ο στόχος φορτώνει το έγγραφο που περιέχει αυτόν τον σύνδεσμο στο παράθυρο που περιέχει τον σύνδεσμο, με τον στόχο _top θα καθαρίσει όλους τους περιλαμβανόμενους δομές και θα φορτώσει το έγγραφο στο ολόκληρο το παράθυρο του browser.
Συμβουλή:Οι τέσσερις τιμές target αυτών ξεκινούν με υπογράμμιση. Οποιαδήποτε άλλη παράγουσα που ξεκινά με υπογράμμιση θα αγνοηθεί από τον browser, οπότε μη χρησιμοποιείτε την υπογράμμιση ως την πρώτη χαρακτήρα οποιουδήποτε ονόματος ή id που ορίζεται στο έγγραφο.
Υποστήριξη browser
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
Υποστήριξη | Υποστήριξη | Υποστήριξη | Υποστήριξη | Υποστήριξη |