工作中使用Less，而Knockoutjs用不用随意时，对其进行了一个初步了解，并做了一个小实例展示数据（未用到后台代码，数据对象模拟var obj={key:value}）。
一、介绍：
Knockoutjs，简称Ko，是一个轻量级的MVVM框架，通过简易的UI绑定语法，可达到动态更新UI的效果。
轻量级：相对重量级而言，对容器依赖较小、占用较小。
MVVM： Model View ViewModel的缩写。
其特点：
1、声明式绑定：通过简易的data-bind语法，可将Dom元素与ViewModel关联。
2、UI自动更新：当ViewModel状态更新时，自动更新UI界面。
3、依赖跟踪： 在模型与数据之间建立隐式关系链。
4、模块化： 每个模块完成一个特定的子功能，所有的模块按某种方法组装起来，成为一个整体，完成整个系统所要求的功能。
5、免费、开源、基于MIT许可证。
6、纯JavaScript实现，可以与任何Web框架集成。
7、小巧，支持所有主流浏览器（IET6+ /Firefox 2+ /Chrome /Opera /Safari）PC/Mobile。
8、完善的文档，包括API、在线实例、教程。
二、下载Knockoutjs文件
从http://knockoutjs.com/下载（示例文件knockout-3.3.0.js）
三、简易html+js代码编写(代码等需分离)
1、新建目录结构
demo
css
js
knockout-3.3.0.js
index.html
2、index.html源码
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>KnockoutJs学习示例</title> <!-- CSS Here--> </head> <body> 1、<span data-bind="text:helloWorld"></span> <br/> 2、<span data-bind="value:helloWorld"></span> <br/> 3、<input data-bind="value:remark" /> <br/> 4、<input data-bind="text:remark" /> <br/> <!-- 备注： 在KO中渲染对象至页面时，使用data-bind进行取值。 其中 如果是文本标签，那么表示为 data-bind="text:选取键名"； 如果是文本域等标签，那么表示为 data-bind="value:选取键名"； 若用反了，不会报错，只会无数据~ --> <!-- JavaScript Files Here --> <script type="text/javascript" src="/js/knockout-3.3.0.js"></script> <script type="text/javascript"> var ViewModel = { helloWorld: '键值对方式存储展示内容，此处键为helloWorld', remark: 'Good!!!' } ko.applyBindings(ViewModel); </script> </body> </html>