jQuery 动态 CSS 加载奇怪的行为答案

【问题标题】：jQuery dynamic CSS loading weird behaviorjQuery 动态 CSS 加载奇怪的行为
【发布时间】：2011-02-14 23:10:16
【问题描述】：

我做的app需要动态加载CSS和JS，目前解决方案如下：

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 
}

}

当需要加载一些小部件时，通常调用be

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

奇怪的是，有一段时间（10 或 20 中的 1 个），example.js 中新创建的 dom 元素将无法从 example.css 中获取其 CSS，但我的 loadCss 方法似乎没有以同步模式加载 CSS？我试图用以下代码替换我的 loadCss：

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

}

那好像没问题（我刷新网页一百次验证:-() 但不幸的是这种方法在IE中失败了（IE7，没有在IE6、8中测试）

有没有更好的解决方案？

【问题讨论】：

标签： jquery css dynamic javascript

【解决方案1】：

首先你可以写

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

这可能会有所帮助，因为您的脚本的两次调用可能几乎同时启动，因此您将添加两个标签，其中只有一个会被更改（两次），因此会丢失一个 CSS。

关于 IE7 - 根据我自己的经验最常见的错误 - 为动态对象中的最后一个元素添加逗号

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

【讨论】：