Maison > interface Web > js tutoriel > Framework JavaScript--Introduction à XMLplus

Framework JavaScript--Introduction à XMLplus

零下一度
Libérer: 2017-05-04 10:20:29
original
1414 Les gens l'ont consulté

Introduction à xmlplus

xmlplus est un JavaScript framework de conception unique pour le développement rapide de projets front-end et back-end.

Conception basée sur les composants

Dans XMLplus, les composants sont les éléments de base. Un critère important pour évaluer la qualité de la conception des composants est le degré d'emballage. Les composants conçus sur la base de XMLplus ont un très haut degré d'encapsulation. Ce qui suit est un exemple de composant simple :

Widget: {
    css: "#widget{ color: red; }",
    xml: `<h1 id=&#39;widget&#39;>default</h1>`,
    fun: function (sys, items, opts) {
        sys.widget.text("hello, world"); 
    }}
Copier après la connexion

Notez que les styles, les documents XML et les fonctions éléments contenus dans ce composant ne sont valides que pour ce composant et sont complètement invisibles pour les autres. composants de. Cette façon d'écrire des composants modifie le modèle traditionnel d'écriture d'applications consistant à placer CSS, JS et HTML dans différents fichiers, mais elle vous rend plus à l'aise lors de la création d'applications. Les composants

sont organisés par espace de noms . La méthode de composant référence basée sur le chemin de répertoire traditionnel rend l'utilisation des composants plus pratique. En supposant que vous ayez défini un composant Calendar situé dans l'espace de noms //ui, vous pouvez alors l'utiliser dans la page HTML comme ceci :

<Calendar xmlns="//ui"/>
Copier après la connexion

Quant à comment définissez le composant, veuillez vous référer à la documentation officielle www.xmlplus.cn/docs.

Compatibilité conviviale

La conception non intrusive permet à xmlplus d'être intégré à presque tous les frameworks ou bibliothèques actuels.

Grâce aux excellentes capacités d'intégration de xmlplus, vous pouvez intégrer des bibliothèques ou des frameworks existants dans votre projet pour éviter de vous retrouver coincé à réinventer la roue.

Ce qui suit est un exemple de Bootstrap Groupe de boutons encapsulé :

Button: {
    xml: `<button type=&#39;button&#39; class=&#39;btn&#39;/>`,
    fun: function (sys, items, opts) {
        this.addClass("btn-" + opts.type);
    }}
Copier après la connexion

Après cette encapsulation, vous pouvez très bien ressembler au suivant Utilisez-le simplement :

<Button type=&#39;default&#39;>Default</Button><Button type=&#39;primary&#39;>Primary</Button><Button type=&#39;success&#39;>Success</Button>
Copier après la connexion

Apprenez une fois, utilisez-le dans plusieurs terminaux

La conception unique de xmlplus lui permet de concevoir des applications basées sur un navigateur et sur un serveur de la même manière.

Côté navigateur, vous pouvez l'utiliser pour développer efficacement des applications monopage. Côté serveur, vous pouvez l'utiliser pour développer des applications de services et des sites Web traditionnels.

Ce qui suit est une simple encapsulation de composant Sqlite d'un serveur.

Sqlite: {
    fun: function (sys, items, opts) {
        var sqlite = require("sqlite3").verbose(),
        return new sqlite.Database("data.db");
    }}
Copier après la connexion

Vous pouvez utiliser le composant SQLite défini ci-dessus comme suit :

Example: {
    xml: `<Sqlite id=&#39;sqlite&#39;/>`,
    fun: function (sys, items, opts) {
        let stmt = "SELECT * FROM users";
        items.sqlite.all(stmt, (err, rows) => console.log(rows));
    }}
Copier après la connexion

Ce framework prend en charge la sérialisation directe et la sortie du code HTML en arrière-plan, utilisez donc xmlplus pour développer des sites Web traditionnels C'est extrêmement pratique. L'exemple suivant le démontre simplement :

HttpServer: {
    xml: `<html>              <body id=&#39;body&#39;>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); 
    }}
Copier après la connexion

Grâce à l'exemple, vous pouvez constater qu'une fois que le service de traitement a accepté la demande, la structure du document XML peut être modifiée de manière dynamique. Cela oblige xmlplus à développer des méthodes de site Web traditionnelles et PHP. , JSP et les autres langages de script sont très différents.

De plus, les fonctionnalités de base telles que la récupération, la communication, le partage et l'instanciation différée incluses dans xmlplus lui sont également uniques et peuvent aider le développement d'applications de manière extrêmement efficace.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal