comportement bizarre jQuery chargement CSS dynamique

Question

L'appli Je travaille sur nécessite le chargement dynamique des CSS et JS, maintenant la solution est la suivante:

myapp.loadCss = function(css){ 
     $("head").append("<link>"); 
     cssDom = $("head").children(":last"); 
     cssDom.attr({rel: "stylesheet", 
       type: "text/css", 
       href: css 
       }); 
} 

myapp.loadJs = funciton(js){ 
... 
//$.ajax call is used in synchronized mode to make sure the js is fully loaded 
} 

} 

Lorsque certains widgets doivent être charge, l'appel d'habitude avec être

myapp.loadCss('/widgets/widget1/css/example.css'); 
myapp.loadJs('/wiggets/widget1/js/example.js'); 

La chose étrange est que, une fois un certain temps (1 sur 10 ou 20), les éléments dom nouvellement créés de example.js ne seront pas en mesure d'obtenir son CSS example.css cependant, il semble ma méthode loadCss ne charge pas le CSS en mode synchronisé? J'ai essayé de remplacer mon loadCss avec le code suivant:

myapp.loadCss(css){ 
$('<link href="' + css + '" rel="stylesheet" type="text/css" />').appendTo($('head')); 

} 

Il semble être OK alors (je rafraîchis la page web cent fois pour la vérification :-() Mais malheureusement, cette méthode a échoué dans Internet Explorer (IE7 , non testé dans IE6, 8)

y at-il une meilleure solution pour cela?

Answer 1

tout d'abord vous pouvez écrire

cssDom = $("head").append("<link>"); 

cette peut aider parce que potentiellement deux appels de votre script peuvent être démarrés presque en même temps et comme résultat vous allez ajouter deux balises et un seul d'entre eux sera changé (deux fois) donc un css sera manquant.

A propos IE7 - de ma propre expérience l'erreur la plus commune - l'ajout d'une virgule pour le dernier élément objet dynamique

var zzz = {a:'a', b:'b',}