4

我最近发现了load.js，但我似乎找不到任何迹象表明这是否可能......（注意：我找不到“load.js”标签......）

我已经让 load.js 成功加载了我所有的 JS 文件，所以我知道它可以工作。有没有人让它也可以加载 CSS 文件？

更新： remyabel 的解决方案非常适合加载物理文件，但这个过程似乎有一些怪癖......

出于某种原因，加载 CSS 文件的顺序以及它们是一次性完成load(file1,file2);还是分阶段完成load(file1).then(file2);似乎会影响样式规则如何应用于标记。我将在我的本地机器上设置一些测试用例来尝试找出发生这种情况的方式或原因，但现在至少正在加载文件。

最后注：

继下面发布的解决方案之后，我决定使用head.appendChild(script);而不是head.insertBefore(script, head.firstChild);将 CSS 元素添加到 DOM（仍然对 JS 文件使用原始方法）。

这不会影响获取和处理文件的顺序，但它会使 Load.js 以与它们列出的顺序相同的顺序插入我的 CSS 链接，并且插入到标题的末尾而不是开头。

4

1 回答 1

4

直接从源代码

   function asyncLoadScript(src) {
        return function (onload, onerror) {
            var script = document.createElement('script');
            script.type = 'text/javascript';
            script.src = src;

我的建议是修改脚本（似乎包含的内容不多）以镜像功能，但要使用链接标签，而不是脚本标签。

反映OP的评论

该脚本构建在chain.js 之上，因此它可能比预期的更复杂。

除非你想要别的东西，我很确定我上面写的就是你需要改变的，所以它看起来像：

   function asyncLoadScript(src) {
        return function (onload, onerror) {

// Get file extension
var ext = src.split('.').pop();
if (ext == "js")
{
                var script = document.createElement('script');
                script.type = 'text/javascript';
                script.src = src;
} else if (ext == "css")
{
                var script = document.createElement('link');
                script.type = 'text/css';
                script.href = src;
                script.rel = "stylesheet";
}

理论上应该可以。如果它不起作用，请再发表评论。

于 2013-05-04T14:52:25.587 回答