1. 10. Как работает атрибут target

Глава 1.15. Как работает атрибут target

Чтобы управлять способами открытия ссылки, существует атрибут target. Разберёмся с его возможностями. У атрибута есть несколько ключевых значений:

• _self — откроет ссылку в том окне браузера (или фрейма), в котором находится ссылка;

• _blank — откроет ссылку в новой вкладке браузера;

• _parent — откроет ссылку в родительском окне браузера (или фрейма), относительно того, в котором находится ссылка; если такого нет, то сработает как _self;

• _top — откроет ссылку в самом верхнем уровне, то есть почти всегда это будет окно браузера, в котором находится ссылка; если ссылка уже находится на странице, то будет работать как _self.

Помимо ключевых значений ему можно задать произвольное значение. Тогда ссылка откроется в фрейме с соответствующим атрибутом name. Если такого фрейма не найдётся, то ссылка откроется в новой вкладке (как при использовании значения _blank).

Применение на практике

Сегодня из всех способов применяется только target="_blank" для того, чтобы открыть ссылку в новой вкладке. Все прочие варианты на практике уже не используются.

Безопасность

Однако, у этого метода есть слабое место: страница, открывающаяся в новой вкладке, имеет частичный доступ к странице, с которой совершён переход. Имея такой доступ, злоумышленник может получить личные данные пользователя.

Чтобы этого избежать, нужно воспользоваться атрибутом rel, записав в него два значения:

• nofollow — делает ссылку закрытой для индексирования поисковыми системами;

• noopener — создаёт новый контекст для открываемой страницы, то есть разрывает связь между страницами, открывшаяся страница больше не имеет доступа к исходной.

Выглядит это так:

<a href="https://htmlacademy.ru" target="_blank" rel="nofollow noopener">.html academy</a>

Кроме того есть способы создать новый контекст с помощью JavaScript, но в этой главе они не рассматриваются.