Knockoutjs 实践入门 (1) 属性绑定

本文介绍Knockout.js——一种基于MVVM模式的轻量级JavaScript库,它支持声明式绑定、UI自动更新等功能。文章通过实例展示了如何定义绑定对象及使用ko.applyBindings将模型与视图关联起来。
1  是什么?
     使用MVVM模式的简单,动态的Javascript UI.

          2   优点

    •  声明式绑定
    •  UI 自动更新
    • 依赖追踪 
    • 模板化 

        3 如何使用 

 <!-- (1)引入knockout js 库-->
 <script src=" http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.3.js"  type="text/javascript"> </script>
 <script src=" http://knockoutjs.com/downloads/knockout-3.3.0.js"  type="text/javascript" > </script>
<script type="text/javascript">   
// (2)定义绑定对象
 function viewModel(firstName,lastName) {       
//使用双向绑定observable
 this.firstName =ko.observable( firstName);      
  this.lastName = lastName;    
};
$(function()
{
    //(3) ko.applyBindings 把模型与申明对象viewModel关联起来(Ko 就是 knockoutjs 的简写,)
   // ko.applyBindings 调用时,保证html加载完毕
    ko.applyBindings(new viewModel("bob","hongbo"));
});
         
 
运行js后可以看到,使用了双向绑定的的firstname,会随着输入框的变化而变化.
 
 
 

转载于:https://www.cnblogs.com/hbb0b0/p/4474616.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值