Question

我正在尝试使用

附加css文件

$('head').append('<link rel="stylesheet" href="style2.css" type="text/css" />');

这很好用 - 但是，我有一些函数在添加了css之后运行，我无法想出让这些文件等到这个文件完成加载的方法？

我该怎么做？

Answer 1

只需检查何时应用了新CSS的规则：

$('head').append('<link rel="stylesheet" href="http://cdn.sstatic.net/stackoverflow/all.css?v=d4a5c7ca0d4c" type="text/css" />');

var fakeListener = setInterval(function(){
    if($("body").css("text-align")=== "center"){
        clearInterval(fakeListener)
        // What you want to do after it loads
    }
},50)

（这是一个有效的例子）

Answer 2

要做的第一件事就是将你的函数放在ready方法中，这将在DOM加载后执行这些函数。

<script type="text/javascript">
  jQuery(document).ready(function() {
    // Your functions come here
});
</script>

然后将您的脚本放在＆lt; / body＆gt;之前。这样，附加将在dom加载时被触发。

<script type="text/javascript">
$('head').append();
</script>

另一个方法是使用加载事件：
使用工作示例检查此链接，在其中我将主体设置为绿色背景，它加载stackoverflow样式表，在完成加载时将主体更改为白色。
http://jsfiddle.net/CQbqA/1/

jQuery附加CSS文件并等到加载？

2 个答案: