Открыть сервис

Атрибут target

Атрибут target — это атрибут HTML-элементов <a> (гиперссылка) и <form> (форма), а также некоторых других элементов, который определяет, где (в каком контексте просмотра) будет открыт связанный документ или отображаться результат отправки формы. Атрибут target задаёт имя окна, вкладки, фрейма или <iframe> для загрузки ресурса, указанного в атрибуте href (для ссылок) или action (для форм). В HTML5 и более поздних версиях атрибут target также может использоваться с элементами <area> и <base>.

Синтаксис и значения

Атрибут target принимает одно из следующих значений:

  • _self — значение по умолчанию. Загружает документ в том же контексте просмотра, где была активирована ссылка. Если элемент <a> находится внутри фрейма, документ откроется в этом же фрейме.
  • _blank — загружает документ в новом окне или новой вкладке браузера (в зависимости от настроек пользователя и реализации браузера). В современных браузерах по умолчанию открывается в новой вкладке.
  • _parent — загружает документ в родительском контексте просмотра. Если текущий контекст не имеет родителя (например, находится в главном окне), работает как _self. Используется в основном при работе с фреймами (<frameset>, <iframe>).
  • _top — загружает документ в самом верхнем (главном) контексте просмотра, полностью замещая текущее окно или вкладку. Если фреймов нет, работает как _self. Позволяет «разорвать» фреймовую структуру.
  • <имя_окна> — произвольное имя, заданное разработчиком. Если окно (или вкладка) с таким именем уже существует, документ загружается в него. Если нет — браузер создаёт новое окно или вкладку с этим именем. Имена не должны начинаться с символа подчёркивания (_), так как зарезервированы служебные значения.

История и развитие

Атрибут target был введён в спецификации HTML 4.0 (1997 год) как часть работы с фреймами. В ранних версиях HTML (до HTML 4.0) не было стандартизированного способа указать, где открывать ссылку — эту функцию выполняли проприетарные расширения браузеров, такие как target="_blank" в Netscape Navigator.

В HTML 4.01 Strict атрибут target был объявлен устаревшим (deprecated) из-за проблем с доступностью и безопасностью, но остался в Transitional и Frameset DTD. В спецификации HTML5 (2014 год) атрибут target был вновь включён в стандарт, но с рядом ограничений и рекомендаций по безопасности.

Безопасность и атрибут rel

Использование target="_blank" без дополнительных мер безопасности создаёт уязвимость, известную как tabnabbing (или «фишинг через вкладки»). Суть: открытая в новой вкладке страница может получить доступ к объекту window.opener исходной страницы и изменить её содержимое (например, перенаправить на фишинговый сайт). Для предотвращения этой атаки в HTML5 был введён атрибут rel="noopener" (или rel="noreferrer"), который отключает передачу ссылки на объект window.opener.

Рекомендация: при использовании target="_blank" всегда указывать rel="noopener noreferrer". Например: ``html <a href="https://example.com"; target="_blank" rel="noopener noreferrer">Ссылка</a> ` В современных браузерах (Chrome 88+, Firefox 79+, Safari 12.1+) поведение target="_blank" по умолчанию эквивалентно rel="noopener"`, но для совместимости с более старыми версиями рекомендуется явное указание.

Применение

Гиперссылки

Наиболее частое использование — открытие внешних ссылок в новой вкладке, чтобы пользователь не покидал текущую страницу. Это особенно актуально для сайтов с длинными статьями, интернет-магазинов или справочных систем.

Формы

Атрибут target у элемента <form> определяет, где будет отображаться результат отправки формы. Например: ``html <form action="/search" method="GET" target="_blank"> <input type="text" name="q"> <button type="submit">Поиск</button> </form> `` Результат поиска откроется в новой вкладке.

Фреймы и <iframe>

В устаревшей технологии <frameset> атрибут target использовался для навигации между фреймами. В современных реализациях с <iframe> значение _parent или _top может применяться для управления контекстом просмотра.

Особенности и ограничения

  • Блокировка всплывающих окон: Браузеры могут блокировать открытие новых окон или вкладок, если действие было инициировано не пользователем (например, при автоматическом перенаправлении через JavaScript). Атрибут target="_blank" в обычной ссылке, по которой кликнул пользователь, обычно не блокируется.
  • Совместимость с фреймами: В современных веб-приложениях, где фреймы почти не используются, значения _parent и _top редко применяются.
  • Доступность: Для пользователей с ограниченными возможностями (например, использующих программы чтения с экрана) внезапное открытие новой вкладки может быть дезориентирующим. Рекомендуется предупреждать пользователя о таком поведении (например, текстом «откроется в новом окне»).
  • Именованные окна: Если разработчик задаёт имя окна, которое уже существует (например, target="mywindow"), браузер может перезагрузить уже открытую страницу, что может привести к потере данных формы.

Примеры использования

```html <!-- Открыть ссылку в новой вкладке с безопасным режимом --> <a href="https://ru.wikipedia.org"; target="_blank" rel="noopener noreferrer">Википедия</a>

<!-- Открыть ссылку в родительском фрейме --> <a href="https://example.com"; target="_parent">Родительский фрейм</a>

<!-- Форма, результат которой открывается в новом окне --> <form action="/submit" method="POST" target="_blank"> <input type="text" name="name"> <button type="submit">Отправить</button> </form> ```

Валидация и ошибки

В HTML5 атрибут target может быть использован с любым элементом, который поддерживает гиперссылки (например, <a>, <area>, <form>, <base>). Однако для элемента <base> атрибут target задаёт значение по умолчанию для всех ссылок на странице. Если в спецификации документа указан target="_blank" в <base>, все ссылки без явного target будут открываться в новой вкладке.

Некорректное значение (например, _new вместо _blank) будет интерпретироваться как имя окна, а не как служебное значение.

Источники

  1. Спецификация HTML Living Standard — раздел «The target attribute» (WHATWG).
  2. Спецификация HTML 5.2 — раздел «4.8.2. The target attribute» (W3C).
  3. Документация MDN Web Docs — «target» (Mozilla).
  4. Статья «Tabnabbing: A New Type of Phishing Attack» (Aza Raskin, 2010).
  5. Руководство по безопасности веб-приложений OWASP — «Tabnabbing».

BFOmetr — база данных и аналитика по компаниям России.

На главную BFOmetr →