-
Notifications
You must be signed in to change notification settings - Fork 2
/
about.html
109 lines (88 loc) · 7.34 KB
/
about.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>关于我们 - jPlusUI</title>
<link href="assets/web/styles/jplus-welcome.css" rel="stylesheet">
<link href="assets/demo/demo.css" rel="stylesheet">
<style>
body {
font-family: 'Microsoft YaHei';
}
h2.demo {
font-size: 24px;
line-height: 40px;
}
p {
text-indent: 2em;
}
</style>
<script src="assets/web/scripts/jplus-welcome.js" type="text/javascript"></script>
<script>var Demo = { web: true }</script>
<script src="assets/demo/demo.js" type="text/javascript"></script>
</head>
<body>
<a href="https://github.com/jplusui/jplusui/" target="_blank" id="forkmeongithub">
<img src="assets/web/images/fork_me_on_github.png">
</a>
<div id="topbar">
<div class="x-container x-clear">
<h1 class="x-left"><a href="index.html" title="jPlusUI - 一个轻量但完整的UI组件库">jPlusUI</a></h1>
<ul class="x-left">
<li><a href="whyjplusui.html" title="组件概念">组件概念</a></li>
<li><a href="features.html" title="设计思路和原则">设计理念</a></li>
<li><a href="demo.html" title="查看组件列表">文档和演示中心</a></li>
<li><a href="download.html" title="获取 jPlusUI">下载</a></li>
<li><a href="community.html" class="selcted" title="讨论和联系方式">社区</a></li>
</ul>
</div>
</div>
<div id="main">
<div id="body">
<article class="demo">
<h2 class="demo">jPlusUI 概述</h2>
<p class="demo">jPlusUI 是一个使用 JavaScript 开发的轻量但完整的 Web UI 组件库。它提供了：</p>
<ul class="demo">
<li>200个可直接使用 UI 组件。</li>
<li>100 多个可复用的 CSS 设计。</li>
<li>200 个常用的 JavaScript 代码和案例。</li>
<li>一个轻量的面向对象的 Javascript 开发框架。</li>
<li>一套完善的组件开发思路、方法、构架和工具。</li>
</ul>
<h3 class="demo">直接使用组件</h3>
<p class="demo">和传统的UI库一样， 所有组件都能直接在项目中使用。用户可以自定义组件，只引用所需要的组件。jPlusUI 的主要特性有：</p>
<ul class="demo">
<li>轻量，但功能丰富，核心部分删除注释后为20K。</li>
<li>虽然类库自带底层，但也可以使用 jQuery 作为底层支持。</li>
<li>所有 UI 组件都是轻量级的封装，更符合前端开发人员的习惯，也方便自定义样式。</li>
<li>作为国产类库，对国内的特有需求提供支持。如城市选择器、解决中文乱码问题。</li>
<li>使用HTML5，但对低版本浏览器(包括 IE6)有降级处理，部分支持移动平台。</li>
</ul>
<p class="demo">jPlusUI 自带两套组件库，一套更适用于互联网级的网页开发，一套更适用于企业级应用开发(目前已暂停维护)。用户可以类似地开发出第三套更适合自己需求的组件库。</p>
<h3 class="demo">组件二次开发</h3>
<p class="demo">一个优秀的组件库可以大大节约项目的时间。但构建组件库是一个费时费力的过程， 所以很多公司为了节约成本，砍掉了组件库。目前 UI 库很多，但没有一个库可以真正满足一个公司的全部需求。因此公司需要对UI库进行二次开发。但大部分UI库都有这样的特点：使用它提供的组件很方便，但想要自定义或新增一些组件却非常困难。</p>
<p class="demo">jPlusUI 本身就是为了二次开发而做的，用户可以轻松定制自己的组件库。这主要体现于：</p>
<ul class="demo">
<li>组件构架透明。添加组件非常方便，并且可以完美地融入组件库。</li>
<li>在代码上完全**面向对象**，方便修改和扩展。</li>
<li>统一规范。让不同的组件之间可以协同工作。</li>
</ul>
</article>
<article class="demo">
<h2 class="demo">jPlusUI 的历史</h2>
<p class="demo">jPlusUI 从出生到现在已经有 36 个月了。在这期间 jPlusUI 经历了 5 次大的改变。最早开发 jPlusUI 是为了开发出一个面向企业级的学习简单的开源 UI 库。虽然当时最有名的企业级 UI 库 Extjs 界面漂亮，但是其代码量大、学习成本高、而且不是完全开源的。 因此 jPlusUI 初衷就是为了代替 Extjs。</p>
<p class="demo">做 UI 组件必然少不了框架底层。最开始 jPlusUI 基于 jQuery 开发，但是 jQuery 只提供了 DOM 操作。而做 UI 框架更需要的是面向对象的组件设计（否则就会和其它 jQuery UI 一样：项目很难做大），因此大部分函数还是需要自己写的。经过一些发展，这些函数独立出来，再加上组件面向对象设计的一些特性无法使用 jQuery 实现（如子类函数重写）。因此 jPlusUI 拥有了第一版框架底层，其最初的开发原型是 Mootools。</p>
<p class="demo">jPlusUI 自带的底层虽然做组件非常方便，但是在单独使用时和 jQuery 比非常不方便。比如：组件设计本身是单一节点的操作。而 jQuery 是根据选择器批量操作，因此 jPlusUI 第一版底层在批量操作上会非常麻烦。还有一个重要的问题是 jQuery 在浏览器兼容问题上做的非常好，这也是自己开发框架所不能及的。因此 jPlusUI 根据 jQuery 的源码，彻底重写了底层框架，保留原版的设计理念，又保证在使用方便和浏览器兼容上能和 jQuery 一样完美。</p>
<p class="demo">jPlusUI 的组件核心部分的最开始原型是 .net framework , 后来不断地精简。它现在已经独立成为一个体系。而 UI 界面最开始原型是 Extjs， 后来不断地从 Bootstrap 学习。总的来说，jPlusUI 的 UI 部分发展是一个漫长又辛苦的过程： 不断学习、不断修复、不断改进。到现在， jPlusUI 的目标是用户无需关心代码本身，只需复制代码就能见到效果。</p>
</article>
</div>
<div id="footer">
<div class="x-container">
<span class="x-right"><a href="about.html">关于我们</a> | <a href="LICENSE.txt" target="_blank">The BSD License</a> | <a href="https://github.com/jplusui/jplusui/issues/new" target="_blank">意见反馈</a> | <a href="community.html">加入我们</a></span>
Copyright © 2011-2012 jPlusUI Team. All Rights Reserved.
</div>
</div>
</div>
<script type="text/javascript" src="assets/web/scripts/stat.js"></script>
</body>
</html>