Skip to content

Tool that generates the JavaScript code to create the nodes of a given HTML code

License

Notifications You must be signed in to change notification settings

sergioifg94/GenDOMan

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

32 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

GenDOMan

GenDOMan is a tool that generates the JavaScript code to create the nodes of a given HTML code

Installation

Clone the repository, cd into the directory and execute $ ./install.sh <installation path>

Usage

A simple example of usage is:

$ gendoman -i input.html

By default, GenDOMan generates ES6 JS code. If you want to select the generated code to use the ECMAScript 5, pass the argument

--ecmascript=es5

In order to wrap the generated code into a template, pass the argument.

--template=template.html

Write the expression {{code}} in the template to tell GenDOMan where to place the generated code. Example:

<html>
    <head>
        <title>This is an example</title>
        <script>{{code}}</script>
    </head>
    <body></body>
</html>

If you want a node to be created dynamically with a foreach loop, use the attribute data-repeat, with the value element in collection, being element the name of the iterating variable, and collection the collection that is iterated. Example:

...
<div data-repeat="node in [1, 2, 3, 4, 5]"></div>
...

This will generate the following code:

// ...
[1, 2, 3, 4, 5].forEach((node) => {
 var node1 = document.createElement("div");
 node0.appendChild(node2);
}
);
// ...

About

Tool that generates the JavaScript code to create the nodes of a given HTML code

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published