1、knockout简介
knockout是一个轻量级的UI类库，通过MVVM模式使JavaScript前端UI简单化
knockout有四大重要概念：
1）声明式绑定：使用简明移读的语法很容易地将模型（model）数据关联到dom元素上。
2）UI界面自动刷新：当宁的模型状态（model state）改变时，您的UI将自动更新
3）依赖跟踪：为转变和联合数据，在你的模型数据之间隐式建立关系
4）模板：为你的模型数据快速编写复杂的可嵌套的UI

2、knockout特性和好处
特性：
优雅的依赖跟踪
声明式绑定
灵活全面的模板
轻易可扩展

好处：
纯javascript类库（兼容任何服务器端和客户端技术）
可添加到web程序最上部（不需要大的架构改变）
简洁的
兼容任何主流浏览器

3、如何使用knockout
声明你的数据作为一个javascript模型对象（model object）,然后dom元素或者模板（templates）绑定到它上面。
下面简介怎样简单使用knockout.js例子

1、现在官网下载最新的knockout.js， 地址： http:www.knockoutjs.com

2、引入knockout.js应注意那些问题

1）用标签<script> src属性引入路径下的knockout.js

2）<script type="text/javascript" src = "js/knockout.js">内容</script>整个放在html文本后面，卸载head里面读取不到js,所以 绑定不到值

3）下面是声明式绑定的一个小例子

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>knockout的用法</title>
</head>
<body>
用户名称：<span id="username" data-bind="text:username"></span><br/>
用户密码：<span id="password" data-bind="text:password"></span><br/>
邮箱地址：<span id="email" data-bind="text:email"></span><br/>
用户住址：<span id="address" data-bind="text:address"></span><br/>

商品名称：<span id="prodName"></span><br/>
</body>
</html>
<script type="text/javascript" src="js/knockout-3.4.0.js"></script>
<script type="text/javascript">
    document.getElementById("prodName").innerHTML="护目镜";
   //声明的一个javascript模型对象，对应webform中的类对象

　　 var testjson = {
        username:"zhangsan",
        password:"1234567",
        email:"zhangsan@123.com",
        address:"广州天河区"
        };
      ko.applyBindings(testjson);
</script>

旧的赋值是用document文档对象赋给某个标签的值

用knockout.js方法直接绑定模型对象中的id就行了

运行后的效果也是一样的

当模型对象改变时，UI界面会自动更新

绑定对应的值会自动更新为

knockout.js的简介和简单使用的更多相关文章

  1. 1.Knockout.Js（简介）

    前言 最近一段时间在网上经常看到关于Knockout.js文章,于是自己就到官网看了下,不过是英文的,自己果断搞不来,借用google翻译了一下.然后刚刚发现在建立asp.net mvc4.0的应用程 ...

  2. Knockout.Js学习目录

    1.Knockout.Js(简介) 2.Knockout.Js(监控属性Observables) 3.Knockout.Js(属性绑定) 4.Knockout.Js(事件绑定) 5.Knockout. ...

  3. Knockout.Js官网学习（简介）

    前言 最近一段时间在网上经常看到关于Knockout.js文章,于是自己就到官网看了下,不过是英文的,自己果断搞不来,借用google翻译了一下.然后刚刚发现在建立asp.net mvc4.0的应用程 ...

  4. C#设计模式总结 C#设计模式(22)——访问者模式（Vistor Pattern） C#设计模式总结 .NET Core launch.json 简介 利用Bootstrap Paginator插件和knockout.js完成分页功能 图片在线裁剪和图片上传总结 循序渐进学.Net Core Web Api开发系列【2】：利用Swagger调试WebApi

    C#设计模式总结 一. 设计原则 使用设计模式的根本原因是适应变化,提高代码复用率,使软件更具有可维护性和可扩展性.并且,在进行设计的时候,也需要遵循以下几个原则:单一职责原则.开放封闭原则.里氏代替 ...

  5. 通过Knockout.js + ASP.NET Web API构建一个简单的CRUD应用

    REFERENCE FROM : http://www.cnblogs.com/artech/archive/2012/07/04/Knockout-web-api.html 较之面向最终消费者的网站 ...

  6. knockout.js简单实用教程1

    第一次接触knockout是在一年多之前吧.当时是接手了一个别人的项目,在项目中有用到knockout来进行数据的绑定.也就开始学习起来knockout.在之后的项目中也多次用到了这个.在第一次开始学 ...

  7. MVC3.0+knockout.js+Ajax 实现简单的增删改查

    MVC3.0+knockout.js+Ajax 实现简单的增删改查 自从到北京入职以来就再也没有接触MVC,很多都已经淡忘了,最近一直在看knockout.js 和webAPI,本来打算采用MVC+k ...

  8. 一个简单的 ASP.NET MVC 例子演示如何在 Knockout JS 的配合下，使用 TypeScript 。

    前言 TypeScript 是一种由微软开发的自由和开源的编程语言.它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程.安德斯·海尔斯伯格,C#的首席架 ...

  9. 【Knockout.js 学习体验之旅】（1）ko初体验

    前言 什么,你现在还在看knockout.js?这货都已经落后主流一千年了!赶紧去学Angular.React啊,再不赶紧的话,他们也要变out了哦.身旁的90后小伙伴,嘴里还塞着山东的狗不理大蒜包, ...

随机推荐

  1. 编译 curl with ssl

    安装 openssh后,使用 curl 的 ./configure --with-ssl 时,报错“找不到 ssl”.因为 curl在 /usr/local/ssl的安装目录下找动态连接库.而ssl默 ...

  2. Silverlight:版本控制的衍化

    版本控制是企业开发中一个老生长谈的主题,这也是大部分公司新人进来后需要接纳的一个基础知识体系. 从08年首次接触商业软件编写后,这几年先后接触了SVN,TFS,Git这几个主要的版本控制器,但是并没有 ...

  3. [原创]Andorid DexClassLoader的创建过程解析（基于5.0）

    做Android插件框架时,经常会用到dex的动态加载,就要直接或间接的使用DexClassLoader,在new DexClassLoader的时候Android系统做了很多工作,下面我们详细分析一 ...

  4. React 根据官方总结的规范

    1.语法上,根据生命周期方法执行的顺序编写代码 (1 生命周期方法［getDefaultProps, getInitialState, componentWillMount, componentDid ...

  5. CreateProcessAsUser,C#写的windows服务弹框提示消息或者启动子进程

    服务(Service)对于大家来说一定不会陌生,它是Windows 操作系统重要的组成部分.我们可以把服务想像成一种特殊的应用程序,它随系统的“开启-关闭”而“开始-停止”其工作内容,在这期间无需任何 ...

  6. 消息中间件Notify和MetaQ-阿里中间件

    3.1.Notify Notify是淘宝自主研发的一套消息服务引擎,是支撑双11最为核心的系统之一,在淘宝和支付宝的核心交易场景中都有大量使用.消息系统的核心作用就是三点:解耦,异步和并行.下面让我以 ...

  7. MFC的消息管理

    一般而言,与视图状态和用户输入有关的命令由视图类来处理,与文件操作有关的命令由文档类来处理,与窗口布局有关的命令由主框架类来处理,与程序的运行状态有关的命令由APP类来处理.

  8. Android事件传递机制

    http://blog.csdn.net/awangyunke/article/details/22047987 1)public boolean dispatchTouchEvent(MotionE ...

  9. Sql触发器模板

    触发器是一种特殊类型的存储过程,它不同于之前的我们介绍的存储过程. 触发器主要是通过事件进行触发被自动调用执行的.而存储过程可以通过存储过程的名称被调用. SQL Server 2005中触发器可以分 ...

  10. 轻量级IOC框架：Ninject （下）

    一,创建依赖链(Chains of Dependency) 当我们向Ninject请求创建一个类型时,Ninject会去检查该类型和其他类型之间的耦合关系.如果有额外的依赖,Ninject也会解析它们 ...