值得分享和收藏的xmlplus组件学习教程
xmlplus 介绍
xmlplus 是一个设计非常独特 javascript 框架，用于快速开发前后端项目。
基于组件设计
在 xmlplus 中，组件是基本的构造块。评价组件设计好坏的一个重要标准是封装度。基于 xmlplus 设计的组件具有极高的封装度。下面是一个简单的组件示例：
widget: {
css: "#widget{ color: red; }",
xml: `<h1 id='widget'>default</h1>`,
fun: function (sys, items, opts) {
sys.widget.text("hello, world");
}
}
注意，这个组件包含的样式、xml 文档以及函数项仅对该组件有效，其它组件对它是完全不可见的。这种组件的书写方式改变了传统的将 css、js 以及 html 置于不同文件的应用书写模式，但它却能使你在构建应用时更加得心应手。
组件由命名空间组织。基于传统目录路径的组件引用方式，让组件的使用更为便捷。假设你已经定义好一个位于命名空间 //ui 的 calendar 组件，那么你可以在 html 页面中这样使用它：
<calendar xmlns="//ui"/>
至于如何定义组件，请参考官方文档 。
友好的相容性
非侵入式的设计，使得 xmlplus 可以与当今几乎所有的框架或者库集成使用。
利用 xmlplus 出色的整合能力，你可以整合现有的库或框架到你的项目中，以避免陷入重造*的困境。
下面是一个封装 bootstrap 按钮组件的一个示例：
button: {
xml: `<button type='button' class='btn'/>`,
fun: function (sys, items, opts) {
this.addclass("btn-" + opts.type);
}
}
经由此封装后，你可以像下面这样非常简洁地使用它：
<button type='default'>default</button> <button type='primary'>primary</button> <button type='success'>success</button>
一次学习, 多端使用
xmlplus 独特的设计，使得它可以以相同的方式，设计基于浏览器端以及基于服务端的应用。
在浏览器端，使用它可以高效地开发单页应用。在服务端，你既可以用它来开发服务应用，还能用它开发传统网站。
下面是一个服务端的一个简单的 sqlite 组件的封装。
sqlite: {
fun: function (sys, items, opts) {
var sqlite = require("sqlite3").verbose(),
return new sqlite.database("data.db");
}
}
你可以像下这样使用上面已经定义好的 sqlite 组件：
example: {
xml: `<sqlite id='sqlite'/>`,
fun: function (sys, items, opts) {
let stmt = "select * from users";
items.sqlite.all(stmt, (err, rows) => console.log(rows));
}
}
本框架支持在后台直接序列化输出 html 代码，所以使用 xmlplus 开发传统网站是极其便利的。下面示例简单地演示了这一点：
httpserver: {
xml: `<html>
<body id='body'>default</body>
</html>`
fun: function (sys, items, opts) {
let http = require("http");
http.createserver((req, res) => {
sys.body.text("hello,world");
res.setheader("content-type", "text/html");
res.end(this.serialize(true));
}).listen(80);
}
}
通过示例，你可以发现，在处理服务接受请求后，可以动态改变 xml 的文档结构，这一点使得 xmlplus 开发传统网站方式与 php、jsp 等脚本语言有着很大的不同。
另外，xmlplus 所包含的检索、通信、共享 以及 延迟实例化 等基本特性也是其独有的，它们可以极其高效地辅助应用的开发。
xmlplus 学习指南
xmlplus 是一个开源的框架，你可以访问官方网站：。官方网站包含详细的入门教程，你可以从这里开始。
另外 xmlplus 的源代码托管于 github，你可以通过访问下面的地址来获取相应的资源：
如果你已经学完了基础教程，那么可以继续学习本博写的 xmlplus 组件设计系列。此系列主要讨论实际中组件的设计思路、方法与技巧等。
xmlplus 组件设计系列之三 - 文本框（textbox）
xmlplus 组件设计系列之五 - 选项卡（tabbar）
xmlplus 组件设计系列之六 - 下拉刷新（pullrefresh）
本系列文章基于 xmlplus 框架。如果你对 xmlplus 没有多少了解，可以访问 。这里有详尽的入门文档可供参考。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
上一篇： 微信小程序 图片上传实例详解