1，HTML元素的面向对象的赋值，数据绑定
text绑定：为p,span,div,td等加text属性值（即元素内部显示的文本），
value绑定：为input添加value属性值，
attr绑定：为元素动态添加他们的属性，如a标签的href,title等等
visible绑定：动态显示隐藏指定的标记，TRUE为显示，FALSE为隐藏
width绑定：可以绑定一个对象，然后在内部标记里就可以访问对象的属性。
<p data-bind="with:lines"> ???单价：<input type="text" data-bind=‘value:productPrice, ?valueUpdate: "afterkeydown"‘ /> ???数量：<input type="text" data-bind=‘visible:productPrice() > 0,value: productCount, valueUpdate: "afterkeydown"‘ /> ???小计：<span data-bind="text:total"></span></p><script type="text/ecmascript"> ???var product = function () { ???????self = this; ???????self.id = 1; ???????self.name = "测试产品"; ???????self.productPrice = ko.observable("0"); //ko.observable会先设置值再返回一个函数赋值给 价格（self.productPrice）,价格就被实时监控，通过productPrice()获取属性值，通过productPrice("4567")改变变量的值 ???????self.productCount = ko.observable("1"); ???????self.total = ko.computed(function () { ???????????return self.productCount() * self.productPrice(); ???????}); ???} ???var products = function () { ???????var self = this; ???????self.lines = ko.observable(new product());//new 实例化一个函数==view model，或直接声明一个对象成为view model ???} ???ko.applyBindings(new products());//data-bind将viewmodel和HTML关联一起，但是浏览器不能识别data-bind，ko.applyBindings(ele1,ele2)激活knockout。applyBindings有两个参数，第一个为必选(创建viewModel），第二个可选用来指定knockout控制HTML的范围。</script>
当productPrice 为0时，会将productCount所在的元素隐藏，而这个实例中的数据返回为一个对象lines，这时如果希望访问它内部属性，需要我们使用with关键字。
knockout.js--基本用法
原文地址：http://www.cnblogs.com/i-douya/p/7816905.html