a2dom README
Overview
a2dom is a small utility function to convert array into DOM.
Example
Simple example:
let a2dom = require('./a2dom.js');
let html1 = a2dom(['a', {href: '/'}, 'home']);
console.log(html1);
//=> '<a href="/">home</a>'
Nested example:
let a2dom = require('./a2dom.js');
let html2 = a2dom(
['table'
, ['tbody', {"class": "user-list"}
, ['tr', {id: 'user-100', "class": 'user'}
, ['td', 100], ['td', 'Alice']
]
, ['tr', {id: 'user-200', "class": 'user'}
, ['td', 100], ['td', 'Bob']
]
]
]
);
console.log(html2);
//=> '<table>
// <tbody>
// <tr id="user-100" class="user">
// <td>100</td><td>Alice</td>
// </tr>
// <tr id="user-200" class="user">
// <td>200</td><td>Bob</td>
// </tr>
// </tbody>
// </table>'
Loop example:
let a2dom = require('./a2dom.js');
let context = {
items: ['Alice', 'Bob', 'Charlice']
}
let html3 = a2dom(
['ul'
, function(arr) { // function representing loop
for (let x of context.items) {
arr.push(['li', x]);
}
}
]
);
console.log(html3);
//=> '<ul>
// <li>Alice</li>
// <li>Bob</li>
// <li>Charlie</li>
// </ul>'
/// or
let html4 = a2dom(
['ul'
, ...(function*() { // generator with spread operator
for (let x of context.items) {
yield ['li', x];
}
})()
]
);
console.log(html4);
License
MIT License
Copyright
copyright(c) 2018 Kauplan Agency all rights reserved.