тег base или как превратить относительную адресацию в абсолютную

Существует несколько случаев, когда бывает полезно использовать тэг base, например, когда одни и те же изображение часто встречаются в разных структурных частях сайта. При этом при частом переносе html страниц с локального компьютера на сервер хостера (разработка ведется на локалке, а готовый материал публикуется) возникает необходимость каждый раз переписывать base, что делать не очень то хочется, а вернее совсем не хочется. Ситуацию может помочь разрешить следующий скрипт:

var url = document.URL.split("/");					//разбиваем url на части
var base = "";
for (var i = 0; i < url.length-2; i++)				//определяем уровень вложенности (2)
//либо for (var i = 0; i < 3; i++)	
base += url[i]+"/";	
document.write("<base href=\"" + base + "\" />");	//пишем результат

Для каждого уровня вложенности необходимо изменить всего лишь одну цифру. Если страниц много, предыдущее можно вынести в отдельный файл, а где надо в head'е писать:

проблемы:

не работает при локальном просмотре страниц (не через веб сервер)
для старых версий IE нужно делить document.URL.split("\\"), т.е. необходимо дорабатывать скрипт
Opera не понимает base в JavaScript'ах

Можно попробовать решить ситуацию элегантнее:

document.write("<base href='"+location.protocol+"//"+location.host+"' />");

Таким образом, в любую страницу мы можем вставить строчку JavaScript кода, которая превратит все относительные ссылки в абсолютные.

полезная информация

Свойство location объекта window возвращает указатель на объект location, содержащий информацию об URI документа, открытого в окне. В общем виде URI имеет вид:

протокол://хост:порт/путь#закладка?запрос

Объект location содержит названные фрагменты URI как свойства, доступные для чтения и записи:

Свойство	Описание
`hash`	Закладка, т.е. часть URI, следующая за символом "#" (включая его).
`host`	Если `port` не равно `null`, то эта строка имеет вид `hostname:port`, в противном случае совпадает с `hostname`.
`hostname`	Имя хоста и домена или IP-адрес.
`href`	Полный URI документа.
`pathname`	Имя файла или пути.
`port`	Номер порта, указанный в URI документа.
`protocol`	Протокол, указанный в URI документа.
`search`	Запрос, т.е. часть URI, следующая за символом "?" (включая его).

Кроме того, данный объект имеет два метода:

Метод	Описание
`reload(flag?)`	Перезагружает текущий документ. Аргумент указывает способ перезагрузки: `true` — перезагрузка с сервера, `false` — перезагрузка из кэш-памяти. Если аргумент опущен, то он принимается равным `false`.
`replace(URI)`	Заменяет текущий документ на документ с заданным URI. При этом текущий документ удаляется из истории просмотра.

Если вам помогла или просто понравилась эта статья вы можете отблагодарить автора кликнув по рекламе. Спасибо!

комментировать:

прежде чем писать комментарий убедитесь, пожалуйста, что он не попадает в нижеследующие категории:

не стоит писать "я чайник, помогите ..." или "я начинающий, объясните ..." - уважайте себя! может вы и новичок, но ведь не тупой же! сами вполне способны во всем разобраться, тем более, что материал здесь изложен весьма доступно
не пишите вопросы типа "как мне сделать такую же менюху как наверху?", "куда вставлять этот код?", "как устроен интернет?" и т.д. - уважайте время автора!
комментарии вида "все, что здесь написано - бред" будут оставлены только если будут подписаны "я такой-то, разработчик сайта такого-то с посещаемостью 1000 хостов в день" и т.п. Если вы не согласны с чем-то - обоснуйте, напишите как правильно, а писать простые ругательства не надо, это не забор

прямые оскорбления кого бы то ни было будут удалятся!
здоровая критика приветствуется!

от кого: