Когда возникает потребность динамической подгрузки файлов javascript, CSS или просто текста CSS можно воспользоваться джаваскриптовым подгрузчиком, не зависимым от браузера и js-библиотек, каковой я и представляю на всеобщее обозрение.
Идеи для этого скрипта были почерпнуты из разных источников, сведены воедино, улучшены и привели к результату:
dynjs={
type: {js: "js", css: "css", csstxt: "csstxt"},
load: function (url_, type_){
if (typeof(type_) == "undefined"){type_ = dynjs.type.js;}
var is_exist=false;
var tag = type_ == dynjs.type.js ? "script" :
type_ == dynjs.type.css ? "link" : "style";
var objects=document.getElementsByTagName(tag);
var src = type_ == dynjs.type.js ? "src" : "href";
for(var i=0; i < objects.length; i++){
var elem=objects[i];
if(elem.getAttribute(src) == url_){is_exist=true;}
}
if(is_exist){return;}
var _elem=document.createElement(tag);
var type = type_ == dynjs.type.js ?
"text/javascript" : "text/css";
_elem.setAttribute("type", type);
_elem.setAttribute(src, url_);
if (type_ == dynjs.type.css){
_elem.setAttribute("rel", "Stylesheet");
}
if (type_ == dynjs.type.csstxt){
if (typeof(_elem.styleSheet) != "undefined"){
_elem.styleSheet.cssText = url_;
} else if (typeof(_elem.innerText) != "undefined"){
_elem.innerText = url_;
} else {_elem.innerHTML = url_;}
}
document.getElementsByTagName("head")[0].appendChild(_elem);
}
};
Варианты использования скрипта:
dynjs.load("superjs.js", dynjs.type.js);
dynjs.load("supercss.css", dynjs.type.css);
dynjs.load("body{background:red;color:white;}", dynjs.type.csstxt);
Пример использования для CSS в виде текста:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>dynjs.test</title></head>
<body>
dynjs.test
<script type="text/JavaScript" src="dynjs.js"></script>
<script type="text/JavaScript">
dynjs.load("body{background:red;color:white;}",dynjs.type.csstxt);
</script>
</body>
</html>