一尘不染

如何检查是否已下载所有CSS文件以使用JavaScript插入HTML?

ajax

我想通过JS动态插入一些HTML内容和一些CSS url。

我有3个以上的CSS文件。我希望在将内容插入页面之前先下载它们。

有没有办法找出上述文件是否已下载?

这是应该如何工作的:

  • 下载css文件;
  • 下载所有css文件后显示HTML;
  • 插入HTML后开始加载JS文件;
  • 加载所有JS文件后触发回调;

阅读 158

收藏
2020-07-26

共1个答案

一尘不染

您可以使用YepNope.js,YepNope允许您构建异步条件测试以查看资源是否已加载。一旦测试通过,您就可以告诉它注入新的CSS或JS文件。

下面的示例来自YepNope.js网站。

yepnope.injectCss( stylesheetSource [, callback ] [, elemAttributes ] [, timeout ]);

// Example
yepnope.injectCss("print.css", function () {
  console.log("css injected!");
}, {
  media: "print"
}, 5000);

您甚至可以先让YepNope加载初始CSS文件,然后在它们完成加载后,YepNope可以触发回调以执行其他任务,例如加载更多JS或CSS文件。

2020-07-26