Добавить CSS в <head> с помощью JavaScript?
Есть ли способ добавить css из строки в файле javascript в заголовок документа с помощью javascript?
Допустим, у нас есть веб-страница со скриптом лайтбокса, для работы этого скрипта требуется файл css.
Теперь добавив этот CSS-файл с<link> сделает загрузку файла CSS даже для людей, у которых не включен js.
Я знаю, что могу динамически загружать файл css со сценарием, но это также означает, что будет 2 http-запроса, и в случаях, когда в файле практически нет css, я нахожу это неэффективным.
Поэтому я подумал про себя, что если бы вы могли поместить CSS, который есть в файле CSS, в сценарий, заставить скрипт анализировать CSS и добавить его в голову, или, что еще лучше, просто добавить сценарий непосредственно в CSS<head> документа.
Но я не нашел в Интернете ничего, что бы указывало на то, что это возможно, так можно ли добавить css в голову с помощью js?
Изменить + РЕШЕНИЕ:Я отредактировал ответ Рорифа на работу кросс-браузер (кроме IE5)
Javascript:
function addcss(css){
var head = document.getElementsByTagName('head')[0];
var s = document.createElement('style');
s.setAttribute('type', 'text/css');
if (s.styleSheet) { // IE
s.styleSheet.cssText = css;
} else { // the world
s.appendChild(document.createTextNode(css));
}
head.appendChild(s);
}