target=»_blank» открывается на новых вкладках в firefox, но не в chrome (стройный)

#html #svelte

Вопрос:

У меня есть небольшое одностраничное приложение с несколькими внутренними ссылками и несколькими внешними ссылками. Я хочу, чтобы все внешние ссылки автоматически открывались на новой вкладке, поэтому я настроил html следующим образом:

     <base target="_blank" />
 

Это отлично работает в chrome. Когда я нажимаю ссылки на панели навигации, мой сайт переходит на ту же вкладку, а когда я нажимаю на внешнюю ссылку, она послушно открывается на новой вкладке.

Однако, когда я посещаю свой веб-сайт с firefox (протестировано несколько версий), каждая ссылка, даже внутренняя на моей панели навигации, открывается на новой вкладке.

Как я могу исправить это, чтобы во всех браузерах на новых вкладках открывались только внешние ссылки? Спасибо

Комментарии:

1. Вы пробовали быть откровенным в ссылках на навигационную панель? Например, использовать target="_self" на них.

Ответ №1:

Статическое решение состояло бы в том, чтобы быть явным для внутренних ссылок, то есть добавлять target="_self" к ним.

Если вы этого не хотите, Javascript также может помочь, в зависимости от ваших настроек.

Предполагая, что все ваши внутренние ссылки являются относительными или, по крайней мере, абсолютными ссылками сервера, и предполагая, что ваша страница статична (например, ссылки не добавляются на страницу после DOMContentLoaded ), следующий фрагмент Javascript решит эту задачу:

 document.addEventListener('DOMContentLoaded', () => {
  for (const externalLink of document.querySelectorAll('a[href^=http]'))
    externalLink.target = '_blank';
}) 
 <a href="https://google.com">Google</a>
<a href="/">Some internal link</a> 

Как указал другой чувак, конечно, это работает только в том случае, если ваши ссылки доступны из документа (а не если они находятся внутри Царства теней).

Комментарии:

1. Не обязательно, если svelte скомпилирован как пользовательские html-компоненты с теневым dom

2. Даунвоте за предложение добавить глобальную манипуляцию dom JavaScript, когда инструментом выбора является платформа на основе компонентов

Ответ №2:

Согласно комментарию @connexo, я решил проблему, прямо заявив

 target="_self"
 

в ссылках навбара.

Комментарии:

1. Я добавил это в свой ответ вместе с альтернативой Javascript.

Ответ №3:

Вам необходимо установить целевой объект специально для внешних ссылок, если вы хотите переопределить функциональность браузера по умолчанию. Создайте компонент ссылки, который делает это.