object.tohtml
v6.0.0
Published
A simple package that let's you to convert Object into HTML!
Downloads
5
Readme
How to use
require("object.tohtml");
const fs = require("fs");
let obj = {
html: {
head: {
title: 'Hello world!'
},
body: {
h1: 'Hello world!'
}
}
}
obj.toHtml().pipe(fs.createWriteStream("index.html"));
// <!doctype html><html><head><title>Hello world!</title></head><body><h1>Hello world!</h1></body></html>API
attrOnly
attrOnly is used to adding a Attribute into a tag like meta or img. Mostly used for Filling all required Attribute in meta or img tag.
Example 1
{
"meta": {
"attrOnly": true,
"name": "description",
"content": "My website!"
}
}Writes:
<meta name="description" content="My website!">Example 2
{
"img": {
"attrOnly": true,
"src": "..."
}
}Writes:
<img src="...">attr
attr is a object that used to adding a Attribute into a element
{
"div": {
"attr": {
"class": "element"
},
"h1": "Hello World!"
}
}Writes:
<div class="element"><h1>Hello World!</h1></div>Alternative way to Writting Attribute
We aren't only giving a trick like that, We're also doing HTML Attribute Mode on this package!
{
"div id='box'": {
....
}
}Writes:
<div id='box'> ..... </div>FAQ
1. I can't add a same element multiple time / When i add 2 br element, It writes 1 Only!!
In Object(), When you write a prototype that already Exist, It'll overwrite it. To bypass this, Object.toHtml has Array Method, Which let's developer to create a multiple element without overwritting another element (Added in v2.0.0):
[
"br",
"br"
]Writes:
<br><br>This can also done inside non-array Object
{
"div": [
"br",
"br"
]
}Writes:
<div><br><br></div>Unfortunately, This is way more worse, Because we can't making 2 div element.
{
"div": [
"br",
"br"
],
"div": [
"br",
"br"
]
}Writes:
<div><br><br></div>Because of that, We're doing the 2nd Method. Writting a Array. Fortunately, This method is completely Works as well:
[
"html",
{ "h1": "Hello World", "p": "It's nice to see you there!" },
"br",
{
"h1": "This is the 2nd h1!",
"p": "See? The Array Method works as well!"
},
"/html"
]Writes:
<!DOCTYPE html><html><h1>Hello World</h1><p>It's nice to see you there!</p><br><h1>This is the 2nd h1!</h1><p>See? The Array Method works as well!</p></html>2. How can i add a Attribute
Add attr
{
"div": {
"attr": {
"class": "navbar-top"
},
"....": "...."
}
}Writes:
<div class="navbar-top"><....>....</....></div>3. How can i write a Attribute in a element like meta,img and some tag like that in JSON?
First off, We need to set attrOnly as true.
{
"meta": {
"attrOnly": true,
"name": "viewport",
"content": "width:device-width, initial-scale=1"
}
}Writes:
<meta name="viewport" content="width:device-width, initial-scale=1">4. How can i add a Attribute in in Array Method?
Just do a thing like Object does
[
{
"div": {
"attr": {
"class": "element1"
}
}
},
{
"div": {
"attr": {
"class": "element2"
}
}
}
]Writes:
<div class="element1"></div><div class="element2"></div>Of course. Doing a thing like HTML does is still Looking Fine as well.
[
"div align='center'"",
"/div"
]Writes:
<div align="center"></div>5. Is old writting function still working?
Yes. You can still do this:
SomeObject.toHtml(process.stdout);or this:
SomeObject.toHtml().pipe(process.stdout);Even you can extend the passthrough to other:
const StreamCache = require("stream-cache");
SomeObject.toHtml(new StreamCache()).pipe(process.stdout);
// Or
SomeObject.toHtml().pipe(new StreamCache()).pipe(process.stdout);6. How to use this package if i overwritted Object.prototype.toHtml???
const render = require("object.tohtml");
render({
"html": {
"body": {
"h1": "Hello World"
}
}
}).pipe(process.stdout);Any question? Ask in our Discord Server/Telegram Group!