Атрибут target

По умолчанию, при переходе по ссылке документ открывается в текущем окне или фрейме. При необходимости, это условие может быть изменено атрибутом target тега <a>. Этот атрибут может принимать следующие значения:

_blank — загружает страницу в новое окно браузера;

_self — загружает страницу в текущее окно;

_parent — загружает страницу во фрейм-родитель;

_top — отменяет все фреймы и загружает страницу в полном окне браузера.

В примере 1 показано создание ссылки на сайт, который открывается в новом окне.

Пример 1. Открытие документа в новом окне

<!DOCTYPE html>
<html lang="ru">
 <head>
  <meta charset="UTF-8">
  <title>Новое окно</title>
 </head>
 <body>
  <p><a href="https://webref.ru" target="_blank">Ссылка открывает новое 
     окно на сайт webref.ru</a></p> 
 </body>
</html>

Для создания валидного кода атрибут target может использоваться только при переходном <!DOCTYPE>, как показано во всех примерах этой статьи.

Если на сайте используются фреймы, то в качестве значения target можно использовать имя фрейма (пример 2).

Пример 2. Открытие документа во фрейме

<!DOCTYPE html>
<html lang="ru">
 <head>
  <meta charset="UTF-8">
  <title>Открытие файла во фрейме</title>
 </head>
 <body>
   <p><a href="https://webref.ru" target="newframe">Сайт webref.ru</a></p> 
 </body>
</html>

Ссылка в примере 2 ведет на сайт webref.ru, открывающийся во фрейме с именем newframe.

Когда у target указано неизвестное значение, например, имя фрейма набрано с ошибкой, то это приводит к тому, что ссылка открывается в новом окне.

Если на веб-странице необходимо сделать, чтобы все ссылки открывались в новом окне, нет необходимости добавлять во все теги <a> target="_blank". Код можно сократить, если вначале страницы добавить строку <base target="_blank">, как показано в примере 3

Пример 3. Использование тега <base>

<!DOCTYPE html>
<html lang="ru">
 <head>
  <meta charset="UTF-8">
  <title>Открытие файла во фрейме</title>
  <base target="_blank">
 </head>
 <body>
  <p><a href="1.html">Ссылка откроется в новом окне</a></p>
  <p><a href="2.html" target="_self">Ссылка откроется в текущем окне</a></p>
 </body>
</html>

Сделать так, чтобы ссылка открывалась в текущем окне, в таком случае можно, если добавить к тегу <a> атрибут target="_self", как показано в данном примере.