如何动态地将 CSS 文件添加到文档 HEAD 并等待文件完全加载?我正在使用 iframe,所以这是我的示例,我如何将 CSS 动态插入到 iframe 中加载的文档。
$(iframe).contents().find('head').append('<link rel="stylesheet" type="text/css" href="style.css" media="screen" />');
这段代码只添加了 CSS 文件,但我需要在其内容加载后做一些操作。任何想法? 我对每个选项都持开放态度,但 CSS 文件的内容不应作为内联代码插入。
谢谢
最佳答案
假设您对 jQuery 有所了解。 这可用于检查样式表是否已成功加载:
if($("link[href='/path/to.css']").length)){
// CSS succesfully loaded.
}
现在让我们构建您需要的这个函数。 您正在将样式表附加到 head 中,因此当 head 元素发生变化时,您需要检查 CSS 是否已成功加载,然后做一些很棒的事情。 (或者在使用一些变量等加载 CSS 之前什么都不做。)
$("head").change(function(){
var url = "/path/to/stylesheet.css";
if($("link[href='" + url + "']").length)){
// CSS succesfully loaded.
} else {
// some problems with the CSS
}
});
如果这不是您想要的,我希望这至少能让您有所作为。
最好的问候,
关于jquery - 将 CSS 动态加载到文档头部并在加载后等待,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26514855/