Skip to content

Examples

Jump to bottom
Johan Hargne edited this page Jul 14, 2021 · 8 revisions

Examples

HTML From Boilerplate

To save time from adding HEAD and BODY tags, you can use the method withBoilerplate() to automatically setup the basic content. You may pass the content to be inserted within the BODY tag as the method parameter, or choose to call document.setContent() afterwards.

const htmlCreator = require('html-creator');

const html = new htmlCreator().withBoilerplate([
  { type: 'div', content: 'I am in a boilerplate!' }
]);

console.log(html.renderHTML());

// <!DOCTYPE html><html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" /></head><body><div>I am in a boilerplate!</div></body></html>

Dynamically Add Content

It is possible to define or change the content of the document after the html-creator class has been created:

const htmlCreator = require('html-creator');

const html = new htmlCreator();
html.setContent([{ type: 'body' }]);
html.document.findElementByType('body').content = 'Added content!';

console.log(html.renderHTML());

// <!DOCTYPE html><body>Added content!</body></html>
const htmlCreator = require('html-creator');

const html = new htmlCreator();
html.setContent([{ type: 'body' }]);
html.document.addElementToType('body', {
  type: 'div',
  content: 'Magic!',
}).content = 'Added content!';

console.log(html.renderHTML());

// <!DOCTYPE html><body><div>Magic!</div></body></html>
Clone this wiki locally