Заметки об HTML, CSS, AJAX, DOM, PHP, MySQL и многом другом

Иногда бывает необходимо загрузить стилевой файл CSS из JavaScript. (Например, если head-часть HTML уже выведена, а нарушать стандарт и подключать CSS и в body нежелательно.)

Делается это следующим образом: создается элемент link и добавляется как дочерний элемент к тегу head с помощью функций работы с DOM-моделью. Код для такого действия имеет примерно такой вид:
var tag_css = document.createElement('link');
tag_css.rel = 'stylesheet';
tag_css.href = 'http://test.ru/styles.css'; // здесь указывается URL стилевого файла
tag_css.type = 'text/css';
var tag_head = document.getElementsByTagName('head');
tag_head[0].appendChild(tag_css);

Если используется библиотека jQuery, то можно добавить тег несколько иначе:

$("head").append("<link>");
css = $("head").children(":last");
css.attr({
rel:  "stylesheet",
type: "text/css",
href: "http://test.ru/styles.css" //здесь указывается URL стилевого файла
});


Запись создана в Суббота, 14 августа 2010 г. в 23:15. Рубрика: CSS, JavaScript, AJAX. Вы можете подписаться на комментарии к этой записи RSS 2.0. Вы можете оставить отзыв, или отправить trackback со своего сайта.