jQuery MiniUI在组件设计上,是简约、独立的,没有复杂的继承体系。
比如使用DataGrid,可以在api文档的datagrid部分,查找到datagrid的所有属性、方法、事件,而无需关注除datagrid之外的任何组件内容。

下面,我们通过查看和理解datagrid的api,来学习如何使用api文档。
1)打开http://www.miniui.com/docs/api,查看datagrid。

2)datagrid的顶部全名是"mini.DataGrid。
通过这个信息,我们可以分别使用javascript和html来创建对象:
Javascript方式:var grid = new mini.DataGrid();
Html方式:<div class="mini-datagrid"></div>;

3)在"Properties”属性表格内,有一些属性名称、数据类型、描述和默认值。
比如"url"属性是“String”类型,我们可以这样操作:
Javascript方式:grid.setUrl("getdata.jsp");
Html方式:<div class="mini-datagrid" url="getdata.jsp"></div>

4)在"Methods"方法表格,有一些方法名称、参数、描述和返回类型。
这些都是公开方法,可以直接调用。
如:grid.gotoPage(0, 1);

5)在"Events"事件表格,有事件名称、事件对象属性、描述。
比如"rowclick"事件,我们可以这样调用:
Javascript方式:grid.on("rowclick", onRowClick);
Html方式:<div class="mini-datagrid"></div>。

使用API时,需要注意如下几点:
1)Html方式创建时,class一般是"mini-"加上小写类名。如"mini-button"、"mini-tree"、"mini-datagrid"。
2)一个属性,对应一个set方法。如:url对应setUrl、data对应setData、columns对应setColumns等,这些方法并没有在“Mehotds”中显示声明,但是照样可以调用,作为属性的一个约定。
3)Html方式设置时,属性数据类型:
      String:字符串。如url="getdata.jsp"、valueField="id"、style="width:500px;height:300px"。
      Boolean:布尔值。如showPager="true"、showHeader="false"。
      Number:数字。如pageSize="20"、pageIndex="0"。
      Date:日期。如DatePicker的value="2010-11-12"。
      Array:数组。不能直接设置,通过方法调用,如grid.setData([ ])。还有比如columns属性就通过特殊的方式设置,具体可以参考任何一个datagrid示例。
3)事件名必须小写。不能出现“onClick”、"onRowClick"这样的命名方式。
4)事件绑定函数,没有括号。不能出现onclick="onClick()"、onrowclick="onRowClick()"等。

通过datagrid的API使用理解,其他组件的API使用也就一目了然了。
可以说,jQuery MiniUI在使用上是极其简单、规范的,而功能是极其强大、丰富的。

网站地址:http://www.miniui.com/demo/

论坛地址:http://miniui.com/bbs/forum.php?mod=viewthread&tid=21&extra=page%3D1

jQuery MiniUI开发系列之:使用API文档的更多相关文章

  1. Java,面试题,简历,Linux,大数据,常用开发工具类,API文档,电子书,各种思维导图资源,百度网盘资源,BBS论坛系统 ERP管理系统 OA办公自动化管理系统 车辆管理系统 各种后台管理系统

    Java,面试题,简历,Linux,大数据,常用开发工具类,API文档,电子书,各种思维导图资源,百度网盘资源BBS论坛系统 ERP管理系统 OA办公自动化管理系统 车辆管理系统 家庭理财系统 各种后 ...

  2. jQuery MiniUI开发系列之:安装部署

    jQuery MiniUI是一套纯Javascript的WebUI控件库,它由几十个Javascript控件组成,是不依赖服务端和数据库的. 下载jQuery MiniUI,解压缩后,开发者可以直接在 ...

  3. jQuery MiniUI开发系列之:UI和数据分离

    使用MiniUI需要注意:UI和数据是分离的. 传统的WEB开发,开发者经常将数据库操作.服务端业务.HTML标签写在一个页面内. 这样会造成开发的混乱,并且难以维护和升级. 使用MiniUI开发的时 ...

  4. jQuery MiniUI开发系列之:创建组件对象

    jQuery MiniUI可以使用Javascript和Html两种方式来创建对象. 1)Javascript创建对象 使用JavaScript创建对象,是最基本的方式,有如下几个要点: 1)使用ne ...

  5. jQuery MiniUI开发系列之:数据验证

    在开发应用系统界面时,往往需要进行很多.复杂的数据验证,当填写的数据符合规定,才能提交保存. jQuery MiniUI提供了比较完美的表单数据验证和错误显示的方式. 常见的表单控件,都有一个验证事件 ...

  6. jquery.Inputmask 插件用法(中文API文档)

      jquery.Inputmask 可以算是input文本输入限制的神器了,内部融合了多种输入限制, 如金额,电话号码,身份证号,网关等..,并且还可以自定义规则. inputmask 据说最早起源 ...

  7. jQuery MiniUI开发系列之:Ajax处理超时、服务端错误

    MiniUI所有组件的ajax交互,均使用标准.成熟的jQuery.ajax. 依赖于jquery ajax组件的完善性,我们可以拦截住每一次ajax请求处理. 比如,拦截ajax返回数据前,判断返回 ...

  8. jQuery MiniUI开发系列之:HTML标签配置

    全部使用Javascript写一个界面,是一件很困难的事. 1)要求有较高的Javascript编程能力. 2)会造成“代码树”问题.一级又一级子"children",需要&quo ...

  9. 共享jQuery/Eclipse/SVN/PS/DW/的API文档

    1:jQuery的API和jquery.js和jquery.min.js 链接:http://pan.baidu.com/s/1gf7GD83 密码:tbt1 2:虚拟机软件和frdora和ubunt ...

随机推荐

  1. MySQL集群在断网后再启动报"Unable to start missing node group"问题处理

    总所周知,MySQL集群又名ndb cluster,而ndb就是network based database的简称,数据库节点之间依靠网络来通信和保证数据分块间的一致性.今天由于机房交换机损坏,导致集 ...

  2. Java 第十周学习总结

    20145113<Java程序设计>第十周学习总结 基础知识 1.网络通讯的方式主要有两种 TCP(传输控制协议)方式:需要建立专用的虚拟连接以及确认传输是否正确 UDP(用户数据报协议) ...

  3. Perl的基本语法(转)

    (原文来自:http://www.jb51.net/shouce/perl.htm)

  4. debug不过的程序

    下面的程序debug是不能通过的. 至于为什么我还不知道. assume cs:codesg codesg segment start: mov ax,2000h mov ss, ax mov sp, ...

  5. Swift笔记

    最近从Xcode6 beta4开始到现在的Xcode6.0.1,使用Swift一段时间了,Swift大体来说,语法与java.c++比较接近,相比objective-c要友好多了,也更容易上手,这里记 ...

  6. java 存储到什么地方

    下面的内容主要来源于<Thinging in Java> 这本书的第22页讲到的,有5个不同的地方可以存储数据: 1).寄存器 这是最快的存储区,因为它位于处理器内部(没错,如果学过计算机 ...

  7. how to build apache log4cxx 0.10 by Visual Studio 201*

    Chapter 1 Official Steps  We are going to follow the steps here, http://logging.apache.org/log4cxx/b ...

  8. grunt压缩js文件

    grunt是node中很好的管理项目的工具,利用它可以实现对整个项目的管理,避免很多重复性的工作如合并.压缩,检查语法等. 使用grunt首先要安装node环境,nodejs官网http://node ...

  9. 有关vue的总结

    1:使用v-for进行循环渲染: <div v-for="(value, key, index) in object"> {{ index }}. {{ key }} ...

  10. JAVA之Forward 和 Redirect的区别

    1.从地址栏显示来说forward是服务器请求资源,服务器直接访问目标地址的URL,把那个URL的响应内容读取过来,然后把这些内容再发给浏览器.浏览器根本不知道服务器发送的内容从哪里来的,所以它的地址 ...