我正在开展一个网络项目. (绝对没有以前的经验).
该项目需要动态地从服务器检索大量内容(如点击按钮).
现在,问题是,我必须以一些整洁,格式化的方式显示内容.比如,可折叠列表,超链接等.我目前正在使用JavaScript.像这样:
li = document.createElement("li");
li.innerHTML = "some_content";
我还需要根据Bootstrap的要求在JavaScript中为那些动态创建的元素添加适当的类.
但是代码现在看起来非常混乱.是否有任何替代解决方案可以避免JS中的所有元素的动态创建,格式化等?
最佳答案
对于knockoutJS解决方案来说,这似乎是一个完美的场景.我刚刚在live example发布了示例代码.
你只需要创建这样的模板 –
(注意数据绑定中的绑定)
并创建视图模型然后应用它 –
// Here's my data model
var viewmodel = function(first,last) {
this.firstName = ko.observable(first);
this.lastName = ko.observable(last);
this.fullName = ko.pureComputed(function() {
// Knockout tracks dependencies automatically. It knows that fullName depends on firstName and lastName,because these get called when evaluating fullName.
return this.firstName() + " " + this.lastName();
},this);
};
ko.applyBindings(new viewmodel("Planet","Earth")); // This makes Knockout get to work
你很高兴能够使用这个输出,只需几分钟.
我用它创建了一个Survey Builder页面,最重要的部分是knockout很快,并且还支持各种js库,如jQuery,AngularJS等.你永远不需要担心渲染ui,只需要获取/设置数据.