Указание базового URL документа с помощью элемента HTML

Веб-сайты построены с помощью ряда ссылок, указывающих на страницы и источники, такие как изображения и таблицы стилей. Есть два способа укажите URL, который ссылается на эти источники: либо использовать абсолютный путь или относительный путь.

Абсолютный путь относится к конкретному месту назначения, обычно он начинается с имени домена (вместе с HTTP), например www.domain.com/destination/source.jpg. Относительный путь противоположен: назначение ссылки зависит от корневого местоположения или в большинстве случаев от имени домена вашего сайта..

Типичный относительный путь будет выглядеть следующим образом:

Если домен вашего сайта, например,, hongkiat.com путь к изображению будет разрешаться в hongkiat.comimages_2 / указания-документа базовый URL-с-HTML-BASE-element.png. Вы должны понимать это, если вы разрабатывали веб-сайт некоторое время..

Но большинство из вас, вероятно, не слышали о элемент. Этот HTML-тег существует со времен HTML4, но пока мало что известно о его реализации. W3C описывает этот элемент как:

“Базовый элемент позволяет авторам указывать URL базы документа в целях разрешения относительных URL-адресов, а также имя контекст просмотра по умолчанию для целей следующих гиперссылок.”

это Элемент в основном определяет базовый URL для относительного пути на веб-страницах. Вместо того, чтобы зависеть от корневого местоположения или домена вашего сайта, вы можете указать его где-то еще, например, на URL-адрес, где ваши ресурсы находятся в CDN (Content Delivery Network). Давайте посмотрим, как это на самом деле работает.

Использование базового элемента

определяется вдоль стороны а также теги в пределах . В следующем примере мы установили базовый URL для Google.

Эта спецификация повлияет на все пути в документе, включая тот, который указан в HREF атрибут и ЦСИ изображений. Итак, предположим, что у нас есть таблица стилей, изображения и ссылки в документе с относительным путем, например, вот так:

  Якорная ссылка  

Хотя наша веб-страница находится под demo.hongkiat.com относительный путь будет относиться к hongkiat.maxcdn.com, следуя базовому пути, указанному в тег. Попробуйте навести курсор мыши на ссылку, и браузер покажет вам, куда именно ведет путь.

Все относительные пути в конечном итоге будут:

  Якорная ссылка  

Установка цели по умолчанию для ссылки

Помимо определения базового URL, тег может также установить цель ссылки по умолчанию через цель приписывать. Скажем, вы хотите, чтобы все ссылки в документе открылись в браузере новая вкладка, установить цель с _blank, вот так.

Ограничения

Однако в некоторых случаях тег содержит несколько предостережений:

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

Если вы используете # в сочетании с для ссылки на разделы в документе вы можете столкнуться с проблемой в Internet Explorer 9. Вместо перехода к указанному разделу Internet Explorer 9 перезагрузит страницу.

Кроме того, бланк HREF приведет к созданию базового URL вместо ссылки на текущий каталог, в котором находится страница (это поведение браузера по умолчанию), что может вызвать непредвиденные проблемы со ссылками.

Заворачивать

удобная функция HTML, которая может упростить ссылки на ссылки в веб-документе. Используйте тег внимательно, чтобы минимизировать подводные камни. Следуйте этим ссылкам ниже для получения дополнительной информации о тег:

• Абсолютные и относительные URL - MSDN
• Базовый элемент HTML - W3C