介绍

Knockout简称ko,是一个轻量级的javascript类库,采用MVVM设计模式(即Model、view、viewModel),简单优雅的实现了双向绑定,实时更新,帮助您使用干净的数据模型来创建丰富的、响应式的用户界面。

Knockout有三大核心特性:

1.优雅的依赖跟踪(Elegant dependency tracking):任何时候数据模型的变化都会自动更新相应的UI部分;

2.声明式绑定(Declarative bindings) : 简单的将UI和你的数据模型关联起来,你就可以创建复杂的动态UI;

3.高度可扩展性(Trivially extensible) : 只需几行代码实现一个自定义的行为来作为声明式绑定;

其他优点:

1.纯净的javascript代码;

2.可以随时添加到你现有的web应用中;

3.轻量级,GZIP后只有13K;

4.能够工作于几乎所有主流浏览器((IE 6+, Firefox 2+, Chrome, Safari, Edge, others);

ko采用的是MVVM设计模式,即model view viewModel。

简单的例子

There are <span data-bind="text: myItems().length"></span> items

就是这么简单,你不必写代码来更新text内容,它会在数组长度改变时自动更新,与此类似,如果我们想利用数组长度控制按钮的可用性仅仅需要:

<button data-bind="enable: myItems().length < 5">Add</button>

【Knockout】一、认识Knockout,你会爱上它的更多相关文章

  1. 【Knockout.js 学习体验之旅】(1)ko初体验

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

  2. knockoutJS学习笔记03:knockout简介

    通常来说,前端的维护难度是比较大的,特别是脚本,虽然像jquery这样的库可以帮助我们减少很多代码,但在稍微复杂的情况下,还是会产生有很多代码.上一篇介绍了模板引擎jsRender,它可以帮我们快速生 ...

  3. MVVM架构~knockoutjs系列之从Knockout.Validation.js源码中学习它的用法

    返回目录 说在前 有时,我们在使用一个插件时,在网上即找不到它的相关API,这时,我们会很抓狂的,与其抓狂,还不如踏下心来,分析一下它的源码,事实上,对于JS这种开发语言来说,它开发的插件的使用方法都 ...

  4. Knockout应用开发指南 第一章:入门

    2011-11-21 14:20 by 汤姆大叔, 20165 阅读, 17 评论, 收藏,  编辑 1    Knockout简介 (Introduction) Knockout是一个轻量级的UI类 ...

  5. 【ASP.NET Web API教程】2.3.5 用Knockout.js创建动态UI

    原文:[ASP.NET Web API教程]2.3.5 用Knockout.js创建动态UI 注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本博客文章,请先看前面的内容 ...

  6. Knockout应用开发指南 第十章:更多信息(完结篇)

    原文:Knockout应用开发指南 第十章:更多信息(完结篇) 1   浏览器支持 Knockout在如下浏览器通过测试: Mozilla Firefox 2.0+(最新测试版本:3.6.8) Goo ...

  7. Knockout应用开发指南

    Knockout应用开发指南 第一章:入门 2011-11-21 14:20 by 汤姆大叔, 20799 阅读, 17 评论, 收藏, 编辑 1    Knockout简介 (Introductio ...

  8. Knockout简单用法

    Knockout简单用法 在最近做的一个项目中,页面数据全部通过js ajax调用webapi接口获取,也就是说页面的数据全部使用javascript脚本填充,这就想到了使用一个MVVM模式的js框架 ...

  9. knockout示例

    最近项目需要用到knockout js,有关knockout的介绍网上已经很多很多了,但是很少有比较全面的示例,于是乎我就自己做了一个小demo,已备以后查阅.knockout经常和knockout. ...

  10. Knockout: 使用knockout validation插件进行校验, 给未通过校验的输入框添加红色边框突出显示.

    之前整理了三篇帖子: Knockout: 使用CSS绑定和event的blur失去焦点事件, 给未通过校验的输入框添加红色边框突出显示. http://www.cnblogs.com/liuzhend ...

随机推荐

  1. VC中监测函数运行时间

    VC++编程时,经常会监控某个算法的计算时间,以确定算法的效率.编码举例如下, //========start: algorithm time============= // SYSTEMTIME s ...

  2. JS 的点点滴滴

    1. ||含义 : 返回第一个有效值 eg : <script type="text/javascript"> var a=""; var c = ...

  3. java虚拟机JVM学习笔记-基础知识

    最近使用开发的过程中出现了一个小问题,顺便记录一下原因和方法--java虚拟机 媒介:JVM是每一位从事Java开发工程师必须翻越的一座大山! JVM(Java Virtual Machine)JRE ...

  4. 【M8】了解各种不同意义的new和delete

    1.首先考虑new operator,new operator 可以认为做了三件事情:a.调用operator new分配一块内存:b.在这块内存上调用构造方法构造对象:返回指针. 2.operato ...

  5. URAL 2048 History 蔡勒公式

     HistoryTime Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hust.edu.cn/vjudge/contest/view.acti ...

  6. MyBatis之三:多表联合查询

    在这篇文章里面主要讲解如何在mybatis里面使用一对一.一对多.多表联合查询(类似视图)操作的例子. 注:阅读本文前请先大概看一下之前两篇文章. 一.表结构 班级表class,学生表student, ...

  7. delphi TToolBar

    工具栏  的属性 xe4的事件 Customizable OnCustomizeCanDelete OnCustomizeCanInsert OnCustomized OnCustomizeAdded ...

  8. Mouse_event 鼠标点击

    //这样就是左键单击 mouse_event( MOUSEEVENTF_LEFTDOWN, 0, 0, 0, 0 );// 按下mouse_event( MOUSEEVENTF_LEFTUP, 0, ...

  9. android开发之Fragment加载到一个Activity中

    Fragments 是android3.0以后添加的.主要是为了方便android平板端的开发.方便适应不同大小的屏幕.此代码是为了最简单的Fragment的使用,往一个Activity中添加Frag ...

  10. 改进uboot,添加自定义快捷菜单

    .在common目录下新增cmd_menu.c文件,内容为: #include<common.h> #include<command.h> #ifdef CONFIG_MENU ...