Bagaimana cara membuat HTML membuka hyperlink di jendela atau tab lain?

93

Ini adalah baris untuk hyperlink di HTML:

<a href="http://www.starfall.com/">Starfall</a>

Jadi, jika saya mengklik "Starfall", browser saya - saya menggunakan FireFox - akan membawa saya ke halaman baru tersebut dan konten jendela saya akan berubah. Saya bertanya-tanya, bagaimana saya bisa melakukan ini dalam HTML sehingga halaman baru dibuka di jendela baru alih-alih mengubah yang sebelumnya? Apakah ada cara seperti itu di HTML?

Dan jika ya, apakah ada cara untuk membuka halaman yang diminta di tab lain (bukan jendela lain) di browser saya?

cemerlang
sumber

Jawaban:

137
<a href="http://www.starfall.com/" target="_blank">Starfall</a>

Apakah itu terbuka di tab atau jendela lain, tergantung bagaimana pengguna telah mengkonfigurasi browsernya.

jujur
sumber
6
Tidak semua browser mendukung tab dan yang mendukungnya, halaman yang dibuka di tab baru vs. jendela baru adalah pengaturan yang dapat dikonfigurasi pengguna. Saat ini tidak ada cara untuk menentukan tautan yang harus dibuka di tab vs. jendela.
bta
2
ingat bahwa atribut target harus dideklarasikan SETELAH atribut href
MC
109

Cara termudah adalah dengan menambahkan tag target.

<a href="http://www.starfall.com/" target="Starfall">Starfall</a>

Gunakan nilai yang berbeda untuk atribut target untuk setiap link jika Anda ingin membuka tab yang berbeda, nilai yang sama untuk atribut target jika Anda ingin mengganti yang lain.

Penjaga penjara
sumber
47
1 untuk menunjukkan bahwa target tidak harus '_blank'.
GSto
4
Perlu dicatat bahwa ini adalah HTML5 yang valid.
AeroCross
Apa yang Anda maksud dengan 'nama'?
Vnge
9

menggunakan target="_blank"

<a target='_blank' href="http://www.starfall.com/">Starfall</a>

jldupont.dll
sumber
8

Anda harus bisa menambahkan

target="_blank"

Suka

<a href="http://www.starfall.com/" target="_blank">Starfall</a>
Jason
sumber
7

The targetatribut jalan terbaik untuk melakukan ini.

<a href="http://www.starfall.com" target="_blank">

akan membukanya di tab atau jendela baru. Adapun, itu tergantung pada pengaturan pengguna.

<a href="http://www.starfall.com" target="_self">

adalah default. Itu membuat halaman terbuka di tab yang sama (atau iframe, jika itu yang Anda hadapi).
Dua berikutnya hanya bagus jika Anda berurusan dengan iframe.

<a href="http://www.starfall.com" target="_parent">

akan membuka tautan di iframe tempat iframe yang memiliki tautan tersebut.

<a href="http://www.starfall.com" target="_top">

akan membuka tautan di tab, tidak peduli berapa banyak iframe yang harus dilalui.

hellol11
sumber
bagaimana cara menggunakan teks berwarna itu dalam contoh orang lain?
hellol11
6

target = _blank terbuka di tab atau jendela baru berdasarkan pengaturan browser.

Untuk memaksa jendela baru gunakan onclick javascript ketiga bagian tersebut diperlukan. url, nama, dan ukuran lebar dan tinggi jendela atau hanya akan terbuka di tab baru.

<a onclick="window.open('http://www.starfall.com/','name','width=600,height=400')">Starfall</a>
Andyman
sumber
4

Anda juga dapat melakukannya dengan menambahkan yang berikut ini ke header halaman Anda:

<base target="_blank">

Ini akan membuat SEMUA link di halaman Anda terbuka di tab baru

patrick
sumber
4

Karena web berkembang dengan cepat, beberapa hal berubah seiring waktu. Untuk masalah keamanan, Anda mungkin ingin menggunakan rel="noopener"atribut ini bersama dengan target="_blank".

Seperti yang dinyatakan dalam Dokumentasi Google Dev , halaman lain dapat mengakses objek jendela Anda dengan window.opener property. Tautan eksternal Anda akan terlihat seperti ini sekarang:

<a href="http://www.starfall.com/" target="_blank" rel="noopener">Starfall</a>
JoeMecPak
sumber
<a href="http://www.starfall.com/" target="_blank" rel="noopener noreferrer">Starfall</a>hari-hari ini tampaknya praktik terbaik untuk memiliki keduanya
ContextCue
1

contoh di bawah ini dengan target="_blank"karya untuk Safari dan Mozilla

<a href="http://www.starfall.com" `target="_blank"`>

Menggunakan target="new"bekerja untuk Chrome

<a href="http://www.starfall.com" `target="new"`>
scottmoo
sumber
2
apa yang membedakan jawaban Anda di antara lusinan jawaban lainnya?
Farside