在运行时加载 knockout.js 库

Question

我想在运行时间加载 knockout.js 库。它被加载但是在 applyBindings() 之后 html body 标签即 <body></body> 消失并抛出

Uncaught TypeError: Cannot read property 'nodeType' of null

        var script = document.createElement("script");
        script.setAttribute("type", "text/javascript");
        script.setAttribute("src", "https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-min.js");
        document.getElementsByTagName("head")[0].appendChild(script);
        ko.applyBindings(viewModel);

我只是不明白，为什么 body 元素会被清空。
P.S。 : 如果我事先添加 knockout.js lib，它会完美运行。

Answer 1

首先，您在使用 ko 时未确保脚本已加载。您需要使用 onload 属性:

传递回调

script.onload = function() {
    ko.applyBindings(viewModel);
}

此外，Knockout 会抱怨，因为您在 DOM 准备好之前调用 applyBindings。尝试运行您的代码作为 DOMContentLoaded 事件回调的一部分：

document.addEventListener("DOMContentLoaded", function() { 
    var script = document.createElement("script");
    script.setAttribute("type", "text/javascript");
    script.setAttribute("src", "https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-min.js");
    document.getElementsByTagName("head")[0].appendChild(script);

    script.onload = function() {
        ko.applyBindings(viewModel);
    }
});

见Fiddle

在运行时加载 knockout.js 库

load knockout.js lib at runtime

javascript

jquery

dom

knockout.js