简单的knockoutjs实现
1、knockoutJs是在MVVM的机制下实现的,所以要有view(HTML页面中的DOM标签)和viewModel(JavaScript中的js代码)。
2、在view中通过data-bind进行数据绑定。
3、在js中通过ko.observable()和ko.applyBindings()方法进行绑定。
4、过程
(1)建立html页面
(2)引入jQuery库和knockoutjs库
(3)建立html标签
(4)js代码实现绑定
<!DOCTYPE html> <html> <head> <script type='text/javascript' src='js/jquery-1.10.2.js'></script> <!--引入knockoutjs库,即knockoutJs安装--> <script type='text/javascript' src='js/knockout.js'></script> <meta charset="UTF-8"/> <title>simple test</title> </head> <body> <!--view 绘制HTML页面,实现knockoutJs绑定<span data-bind="text:personName"> text用于显示文字, 显示名字和年龄--> The name is <span data-bind="text:personName"></span> <br> The age is <span data-bind="text:personAge"></span> <script type="text/javascript"> //定义用户名和年龄 var name = "Bob"; var age = 12; //给输出的内容进行赋值 //ko.observable 提供参数的动态变化 var myViewModel = { personName: ko.observable(name), personAge: ko.observable(age) }; //通过ko.applyBindings()方法进行绑定 ko.applyBindings(myViewModel); </script> </div> </body> </html>