Se je kdo že igral s tem? Načeloma je zadeva besno enostavna, zelo podobno se dinamično vključuje JS in CSS, takole:
CSS: (predvidevamo, da imamo v spremenljivkah file in media o datoteki in media typu)
var head = document.getElementsByTagName('head').item(0);
var css = document.createElement('link');
css.setAttribute('type', 'text/css');
css.setAttribute('rel', 'stylesheet');
css.setAttribute('href', file);
css.setAttribute('media', media);
head.appendChild(css);
JS: (predvidevamo, da imamo v spremenljivki file podatek o datoteki)
var head = document.getElementsByTagName('head').item(0);
script = document.createElement('script');
script.setAttribute('type', 'text/javascript');
script.setAttribute('src', file);
head.appendChild(script);
Do težave pridem, ko želim loviti dogodek, ko se datoteka uspešno naloži, za JS je to enostavno:
var func = function() {
// some code
};
script.onload = func;
script.onreadystatechange = function() {
if (/complete|loaded/.test(script.readyState)) func();
};
script.onload se izvrši v IE, script.onreadystatechange pa v FF (imamo problem, ker se lahko izvrši dvakrat, ampak pustimo to, ne bi dodajal kode, zaradi preglednosti).
Če želim to isto storiti s CSS, se v FF ne zgodi nič, ni nobenega dogodka, niti load, niti readystatechange, v IE se baje izvrši kar oboje :)
Vprašanje je enostavno, se je kdo že ubadal s tem problemom in uspešno rešil detekcijo uspešno dinamično naloženega CSSja? Na webu sem sicer našel "rešitev", ki pa ne deluje, preverjanje document.styleSheets.length, ki se, po mojih opažanjih, poveča takoj, ne pa šele takrat, ko je CSS že naložen, neuporabno skratka.