如何检测多个样式表何时动态注入javascript

时间:2012-07-09 11:03:15

标签: javascript

我有以下函数,当相应的HTML也被注入页面时,它会动态加载样式表。

这一切都很棒。注入的html是隐藏的,然后一旦加载了样式表,就会将其设置为可见。

function _addCssFile(filename, fragment) {

                var stylesheet = doc.createElement("link");
                stylesheet.setAttribute("rel", "stylesheet");
                stylesheet.setAttribute("type", "text/css");
                stylesheet.setAttribute("href", filename);
                doc.getElementsByTagName("head")[0].appendChild(stylesheet);

            stylesheet.onload = function(){
                fragment.setAttribute("style", "visibility:visible;");
            }          
}

然而,有一段html可能会注入一个以上的css文件,所以我需要能够检测到数组中的所有css文件何时成功注入DOM。

上面的函数针对每个包含的css文件运行,一旦注入了整个样式表,我将如何开始触发事件?正如您所看到的,注入的html当前将被设置为第一个加载的样式表可见,并且对于每个后续文件也是如此。

1 个答案:

答案 0 :(得分:3)

有一个柜台。对于添加的每个CSS文件,递增计数器。对于加载的每个CSS文件,减少它。如果在添加了所有CSS文件后计数器达到零,则它们都已加载。