HTML <base> TAG и путь к локальной папке с Internet Explorer
Я пытаюсь использовать <base> TAG, чтобы указать исходную папку, содержащую файлы мультимедиа для моих html-страниц, расположенных в отдельной папке.
У меня есть следующая структура папок:
A
|- HTML_PAGES (contains html files)
|- MEDIA_FOLDER (contains the media used by this html pages)
Я пытаюсь указать html файлы на носитель, используемый html-страницами, поэтому в каждом html файле у меня есть что-то вроде этого:
<base href="../MEDIA_FOLDER"/>
И проблема в том, что он работает для некоторых браузеров (Opera, Chrome), но он не работает для Internet Explorer и Firefox. Как заставить его работать с IE и Firefox?
Ответы
Ответ 1
Это определенно очень раздражающая ошибка в IE, но я просто нашел обходное решение.
Чтобы понять, что IE разрешает относительный путь, а затем быстро игнорирует его. Вы даже можете увидеть полностью разрешенный URL, проверив значение свойства базового тега "href" позже, используя JavaScript. Таким образом, этот (довольно глупый) фрагмент кода сбрасывает атрибут тега <base>
на полный URL-адрес, который IE уже разрешил, тем самым, чтобы он больше не игнорировался.
Добавьте следующий HTML-код вверху страницы, сразу после тега и до того, как вы действительно используете какие-либо URL-адреса:
<!--[if IE]><script type="text/javascript">
// Fix for IE ignoring relative base tags.
(function() {
var baseTag = document.getElementsByTagName('base')[0];
baseTag.href = baseTag.href;
})();
</script><![endif]-->
(условные комментарии необходимы, так как этот код может разорвать тег <base>
в Safari/Chrome, и другие браузеры явно не нуждаются в нем.)
Такая глупая ошибка.
Ответ 2
Похоже, есть две отдельные проблемы с IE8 и IE9.
http://social.msdn.microsoft.com/Forums/en-US/iewebdevelopment/thread/c51bb8b9-40ab-437b-a125-88b660f3e1ca/
http://social.msdn.microsoft.com/Forums/en-US/iewebdevelopment/thread/e5cfdf07-494c-4703-aa4a-34a1a548de05/
Обходной путь, который, кажется, работает в IE8 и IE9, включает http://в базовом href. Я не испытываю никаких проблем в Firefox (v9)
Ответ 3
<base href="../MEDIA_FOLDER"/>
Не имеет завершающей косой черты, поэтому он относится к файлу с именем MEDIA_FOLDER
, а не к папке. Часто вы не замечаете разницы, потому что веб-сервер перенаправляет попытку извлечь folder
на правильный адрес folder/
, который затем обычно возвращает документ по умолчанию (например, folder/index.html
). Но для относительного разрешения URL это действительно имеет значение.
target
относительно /folder
не /folder/target
, это просто /target
. Чтобы сделать это /folder/target
, вы должны сообщить браузеру, что базовый URL-адрес - это папка, добавив конечную косую черту:
<base href="../MEDIA_FOLDER/"/>
Здесь нет причин для разного поведения браузера. Однако место, в котором вы можете найти другое поведение браузера, - это если вы случайно использовали обратную косую черту в стиле Windows файловой системы \
вместо /
, поэтому проверьте это.
Ответ 4
Используйте абсолютный URL:
<base href="http://yourdomain.com/MEDIA_FOLDER"/>
Ответ 5
Является ли ваш элемент base
внутри элемента body
? Это может вызвать проблему. (Проверьте Firebug, он может оказаться в body
, даже если ваш код выглядит нормально с первого взгляда.)
Ответ 6
Это известная проблема, и IE требует закрыть тег, но не Firefox, другим браузерам просто все равно. Вот что работает для меня:
<base href="{BASE_PATH}"><!--[if IE]></base><![endif]-->
Не стесняйтесь настраивать свою волю и, конечно же, заменять {BASE_PATH} своим фактическим путем, я обычно использую абсолютный путь, но я видел эту работу относительно относительной.
EDIT: И обратите внимание, что ваш путь должен заканчиваться конечной косой чертой
Ответ 7
Ричард ответил мне ближе к рабочему решению, вот что я в итоге приспособил.
<!--[if IE]><script type="text/javascript">
// Fix for IE ignoring relative base tags.
(function() {
var baseTag = document.getElementsByTagName('base')[0];
baseTag.href = window.location.protocol + '//' + window.location.host + baseTag.href;
})();
</script><![endif]-->
Ответ 8
Я не уверен, как BASE работает с относительными URL-адресами каталога, попробуйте присвоить ему относительный URL-адрес, например
<base href="/MEDIA_FOLDER"/>