xmlplus ·

Xmlplus is a JavaScript framework，It can not only run on the browser-side, but also on the server-side. For more information, see https://xmlplus.cn.

Installation

If having installed the NPM client, you can install xmlplus with NPM.

``bash
$ npm install xmlplus
`

The following is the basic organizational structure of the project:

`bash
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.

$3

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.

`js
// 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.

$3

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.

`js
// 02-02
xmlplus("xp", function (xp, $_, t) {
$_().imports({
Index: {
css: "#text { color: red; }",
xml: "

hello, world

",
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.

`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`.