xmlplus 是一个 JavaScript 框架,用于快速开发前后端项目
xmlplus 是一个 JavaScript 框架,用于快速开发前后端项目。 基于组件设计 在 xmlplus 中,组件是基本的构造块。评价组件设计好坏的一个重要标准是封装度
JavaScript 框架
共29Star
详细介绍
xmlplus ·
![License](https://camo.githubusercontent.com/087937c74f6a4d293f7e5d9714ca5d45aef55b54/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f6c2f786d6c706c75732e737667)
Xmlplus is a JavaScript framework,It can not only run on the browser-side, but also on the server-side. For more information, see http://xmlplus.cn.
Installation
If having installed the NPM client, you can install xmlplus with NPM.
$ npm install xmlplus
The following is the basic organizational structure of the project:
xmlplus/
├── xmlplus.js
├── patch/
├── docs/
└── example/
├── getting-started/
├── docs/
├── components/
└── api/
Here, the xmlplus.js
is the source file. Two patch files under the patch/
are for IE9+. The docs/
and the example/
under the xmlplus/
contain subfolders with the same name. The docs/
contains document files and the example/
contains the corresponding sample code.
Basic templates
Xmlplus is a framework that can not only run on browser-side but also on server-side. Here we'll give two sets of basic templates for different environments.
Server-side based
The following is the JavaScript template we fist give to run directly on the server-side. You can modify or extend the functionality based on this. The template is very simple. After installing the xmlplus software package, you just need to create a file containing following content.
// 02-01
xmlplus("xp", function (xp, $_, t) {
$_().imports({
Index: {
fun: function (sys, items, opts) {
console.log("hello, world");
}
}
});
}).startup("//xp/Index");
Having created a file containing the above content, you can execute node index
to run the above template example.
In addition, please note that a comment line at the beginning of the sample. The line indicate that the current sample code is located at /example/docs/02-templete/01/
. The 02
here is the chapter order and the 01
is the name of the folder containing the sample.
Browser-side based
On the browser-side, you need to prepare three files. The first is the xmlplus.js
. The second you need to create is a file named index.js
containing following content.
// 02-02
xmlplus("xp", function (xp, $_, t) {
$_().imports({
Index: {
css: "#text { color: red; }",
xml: "<h1 id='text'>hello, world</h1>",
fun: function (sys, items, opts) {
sys.text.css("font-size", "28px");
}
}
});
});
At last, you need a HTML file containing following content. Here, we name the file as index.html
.
<!-- 02-02 -->
<!DOCTYPE html>
<html>
<head>
<script src="xmlplus.js"></script>
<script src="index.js"></script>
</head>
<body>
<i:Index xmlns:i="//xp"></i:Index>
</body>
</html>
Ensure that the above three files are in the same folder. If opening the index.html
with a browser, you should be able to see the red hello, world
.
Browser and device support
For the server-side, xmlplus supports all versions of the node.js runtime environment, so here we only to discuss its performance on the browser-side. Xmlplus has the best performance on the latest desktop and mobile browsers. However, on some older browsers it may fail.
Supported browser
Xmlplus supports mainstream browsers and platforms. On the Windows platform, it supports Internet Explorer 9-11 / Microsoft Edge. Please see the details listed below.
Mobile device
In general, xmlplus supports the latest version of the browser for each mainstream platform.
Chrome | Firefox | Safari | Android Browser & WebView | Microsoft Edge | |
---|---|---|---|---|---|
Android | Supported | Supported | N/A | Android v4.0+ Supported | N/A |
iOS | Supported | Supported | Supported | N/A | N/A |
Windows 10 Mobile | N/A | N/A | N/A | N/A | Supported |
Desktop browser
Accordingly, xmlplus also supports most of the latest version of the desktop browser.
Chrome | Firefox | Internet Explorer | Microsoft Edge | Opera | Safari | |
---|---|---|---|---|---|---|
Mac | Supported | Supported | N/A | N/A | Supported | Supported |
Windows | Supported | Supported | Supported, IE9+ | Supported | Supported | Not supported |
Internet Explorer
As we have mentioned above, xmlplus supports Internet Explorer 9-11, but this requires the additional two files: xpath.js
and xmldom.js
.
These two files can be found in the patch/
. That is to say, if you want the application based on xmlplus running on Internet Explorer 9-11, you need to import the following three JavaScript files.
<script src='xpath.js'></script>
<script src='xmldom.js'></script>
<script src='xmlplus.js'></script>