1 | <!DOCTYPE html>
|
2 | <html lang="en">
|
3 | <head>
|
4 | <meta charset="UTF-8">
|
5 | <meta http-equiv="Content-Type" name="viewport" content="width=device-width, initial-scale=1"/>
|
6 | <title>xml-lite</title>
|
7 | <link rel="stylesheet" href="https://leungwensen.github.io/zfinder/dist/lib/normalize-4.2.0.min.css">
|
8 |
|
9 | <link rel="stylesheet" href="https://leungwensen.github.io/zfinder/dist/lib/github-markdown-2.3.0.min.css">
|
10 | <link rel="stylesheet" href="https://leungwensen.github.io/zfinder/dist/zfinder/markdown-previewer.css">
|
11 | </head>
|
12 | <body>
|
13 | <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"
|
14 | style="width:0;height:0;position:absolute;overflow:hidden;">
|
15 | <defs>
|
16 | <symbol id="si-zfinder-collapse-left" viewBox="0 0 38 38">
|
17 | <path d="M38 0H0v38h38V0zM3 35V3h32v32H3zM5 5v28h17V21h-9.667L16 26h-4l-5-7 5-7h4l-3.667 5H22V5H5z"/>
|
18 | </symbol>
|
19 | <symbol id="si-zfinder-expand-right" viewBox="0 0 38 38">
|
20 | <path d="M0 0h38v38H0V0zm35 35V3H3v32h32zM22 5v28H5V21h9.667L11 26h4l5-7-5-7h-4l3.667 5H5V5h17z"/>
|
21 | </symbol>
|
22 | <symbol id="si-zfinder-fullscreen" viewBox="0 0 28 28">
|
23 | <path d="M4 18H0v10h10v-4H4v-6zm-4-8h4V4h6V0H0v10zm24 14h-6v4h10V18h-4v6zM18 0v4h6v6h4V0H18z"/>
|
24 | </symbol>
|
25 | <symbol id="si-zfinder-fullscreen-exit" viewBox="0 0 28 28">
|
26 | <path d="M0 22h6v6h4V18H0v4zM6 6H0v4h10V0H6v6zm12 22h4v-6h6v-4H18v10zm4-22V0h-4v10h10V6h-6z"/>
|
27 | </symbol>
|
28 | </defs>
|
29 | </svg>
|
30 | <nav id="toc">
|
31 | <div id="toc-body" class="toc-body"></div>
|
32 | </nav>
|
33 | <article id="markdown">
|
34 | <nav id="markdown-header" class="markdown-header">
|
35 | <svg class="si" id="toggle-toc" width="24" height="24">
|
36 | <use xlink:href="#si-zfinder-collapse-left"></use>
|
37 | </svg>
|
38 | <svg class="si float-right" id="toggle-fullscreen-article" width="24" height="24">
|
39 | <use xlink:href="#si-zfinder-fullscreen"></use>
|
40 | </svg>
|
41 | </nav>
|
42 | <div id="markdown-body" class="markdown-body"><h1>xml-lite</h1>
|
43 | <p><strong>Maintaining XML</strong> in pure javascript (IN BOTH NODE.JS & BROWSERS) <a href="https://leungwensen.github.io/xml-lite/">Homepage</a></p>
|
44 | <h2>Maintaining?</h2>
|
45 | <h3>Converting</h3>
|
46 | <figure><img src="./doc/uml/converting.png" alt="converting"></figure>
|
47 | <h3>Editing/Traversing</h3>
|
48 | <pre><code class="language-javascript">XMLLite.findChildNode(doc, query);
|
49 | XMLLite.findChildNodes(doc, query);
|
50 | XMLLite.findOrCreateChildNode(doc, query);
|
51 | XMLLite.removeChildNode(doc, query);
|
52 | XMLLite.eachChildNode(doc, query, callback);
|
53 | <span class="hljs-comment">// ...</span>
|
54 | </code></pre>
|
55 | <h3>Formatting</h3>
|
56 | <pre><code class="language-javascript">XMLLite.beautify(xml, indent);
|
57 | XMLLite.uglify(xml, preserveComments);
|
58 | XMLLite.sanitize(xml, reverse);
|
59 | <span class="hljs-comment">// ...</span>
|
60 | </code></pre>
|
61 | <p>Actually, you can get the js object from <code>XMLLite.xml2js(xml)</code>, do whatever you want, and convert it back to xml again with <code>XMLLite.js2xml(obj)</code>.</p>
|
62 | <h2>Why?</h2>
|
63 | <ol>
|
64 | <li>A reasonable need for usage in both Node.js and Browsers</li>
|
65 | <li>A more reasonable need to use native APIs(DOMParser/XMLSerializer) to speed up the maintaining process and keep the library thin</li>
|
66 | </ol>
|
67 | <h2>Why <code>xml-lite</code>?</h2>
|
68 | <ol>
|
69 | <li>It <strong>works exactly the same in both Node.js and Browsers</strong></li>
|
70 | <li>The browser version is supper <strong>light-weight</strong>(<a href="./dist/xml-lite.js">dist/xml-lite.js</a>)</li>
|
71 | <li><strong>Convenient</strong> APIs for converting between xml/js/json/DOM, and lots of helpers to maintain the data structures</li>
|
72 | <li>Super <strong>fast</strong>. it takes less than 30ms to convert an xml document with over 1,000 nodes into a js object</li>
|
73 | </ol>
|
74 | <h2>Install</h2>
|
75 | <pre><code class="language-shell">$ npm install xml-lite --save
|
76 | $ npm install xml-lite -g
|
77 | </code></pre>
|
78 | <h2>Usage</h2>
|
79 | <p>In Node.js</p>
|
80 | <pre><code class="language-javascript"><span class="hljs-keyword">const</span> XMLLite = <span class="hljs-built_in">require</span>(<span class="hljs-string">'xml-lite'</span>);
|
81 | </code></pre>
|
82 | <p>Command line client</p>
|
83 | <pre><code class="language-shell">$ xml-lite --help
|
84 | </code></pre>
|
85 | <p>In browsers</p>
|
86 | <pre><code class="language-html"><span class="hljs-tag"><<span class="hljs-name">script</span> <span class="hljs-attr">src</span>=<span class="hljs-string">"$path/to/xml-lite/dist/xml-lite.js"</span>></span><span class="handlebars"><span class="xml"> <span class="hljs-comment"><!-- window.XMLLite is available --></span>
|
87 | </span></span></code></pre>
|
88 | <p>In browsers with webpack</p>
|
89 | <pre><code class="language-javascript"><span class="hljs-keyword">import</span> XMLLite <span class="hljs-keyword">from</span> <span class="hljs-string">'xml-lite/lib/index-browser'</span>;
|
90 | </code></pre>
|
91 | <h2><a href="https://leungwensen.github.io/xml-lite/">Demo</a></h2>
|
92 | <h2><a href="./doc/api.html">API</a></h2>
|
93 | <h2><a href="./doc/json-spec.html">JSON spec</a></h2>
|
94 | <h2><a href="./doc/roadmap.html">Roadmap</a></h2>
|
95 | <h2><a href="./doc/projects-using-xml-lite.html">Projects using xml-lite</a></h2>
|
96 | <h2><a href="./doc/contributing.html">Contributing</a></h2>
|
97 | </div>
|
98 | </article>
|
99 | <div id="loading">
|
100 | <div class="sk-double-bounce">
|
101 | <div class="sk-child sk-double-bounce1"></div>
|
102 | <div class="sk-child sk-double-bounce2"></div>
|
103 | </div>
|
104 | </div>
|
105 |
|
106 | <script src="https://leungwensen.github.io/zfinder/dist/lib/jquery-3.1.0.min.js"></script>
|
107 | <script src="https://leungwensen.github.io/zfinder/dist/lib/screenfull-3.0.0.min.js"></script>
|
108 | <script src="https://leungwensen.github.io/zfinder/dist/zfinder/markdown-previewer.js"></script>
|
109 | </body>
|
110 | </html>
|