溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
xmlplus 介紹
xmlplus 是一個設計非常獨特 JavaScript 框架，用于快速開發前后端項目。
基于組件設計
在 xmlplus 中，組件是基本的構造塊。評價組件設計好壞的一個重要標準是封裝度。基于 xmlplus 設計的組件具有極高的封裝度。下面是一個簡單的組件示例：
Widget: {
css: "#widget{ color: red; }",
xml: `<h2 id='widget'>default</h2>`,
fun: function (sys, items, opts) {
sys.widget.text("hello, world");
}
}
注意，這個組件包含的樣式、XML 文檔以及函數項僅對該組件有效，其它組件對它是完全不可見的。這種組件的書寫方式改變了傳統的將 CSS、JS 以及 HTML 置于不同文件的應用書寫模式，但它卻能使你在構建應用時更加得心應手。
組件由命名空間組織。基于傳統目錄路徑的組件引用方式，讓組件的使用更為便捷。假設你已經定義好一個位于命名空間 //ui 的 Calendar 組件，那么你可以在 HTML 頁面中這樣使用它：
<Calendar xmlns="http://ui"/>
至于如何定義組件，請參考官方文檔 http://www.xmlplus.cn/docs。
友好的相容性
非侵入式的設計，使得 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 是一個開源的框架，你可以訪問官方網站：http://www.xmlplus.cn。官方網站包含詳細的入門教程，你可以從這里開始。
另外 xmlplus 的源代碼托管于 github，你可以通過訪問下面的地址來獲取相應的資源：
https://github.com/qudou/xmlplus
如果你已經學完了基礎教程，那么可以繼續學習本博寫的 xmlplus 組件設計系列。此系列主要討論實際中組件的設計思路、方法與技巧等。
xmlplus 組件設計系列之一 - 圖標（ICON）
xmlplus 組件設計系列之二 - 按鈕（Button）
xmlplus 組件設計系列之三 - 文本框（TextBox）
xmlplus 組件設計系列之四 - 列表（List）
xmlplus 組件設計系列之五 - 選項卡（Tabbar）
xmlplus 組件設計系列之六 - 下拉刷新（PullRefresh）
本系列文章基于 xmlplus 框架。如果你對 xmlplus 沒有多少了解，可以訪問 www.xmlplus.cn。這里有詳盡的入門文檔可供參考。
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
