boltjs-preview/components.js

The modern web framework to build comprehensive web apps with native speeds

import { event, attribute } from ".";
import { AppNavigator, Navigate } from "./boltrouter";

export function Link(url, child, ...variables) {
    return attribute(event(
        child,
        {
            click: () => {
                Navigate(url, ...variables)
            }
        }
    ), {
        style: "cursor: pointer;"
    })
}

/**
 * 
 * @param {*} url 
 * @param {*} child 
 * @param  {...any} variables 
 * @returns HTMLElement
 *
 * The AppLink function wraps another function and makes a client-side
 * linking making it to transition to another route without full
 * reload ( no SSR )
 */
export function AppLink(url, child, ...variables) {
    return attribute(event(
        child,
        {
            click: () => {
                AppNavigator(url, ...variables)
            }
        }
    ), {
        style: "cursor: pointer;"
    })
}

export function a(...children) {
    //first create the Tag
    var a = document.createElement("a");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            a.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            a.appendChild(i)
        }
    })
    //send the tag
    return a
}


export function abbr(...children) {
    
    //first create the Tag
    var abbr = document.createElement("abbr");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            abbr.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            abbr.appendChild(i)
        }
    })
    //send the tag
    return abbr
}


export function acronym(...children) {
    
    //first create the Tag
    var acronym = document.createElement("acronym");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            acronym.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            acronym.appendChild(i)
        }
    })
    //send the tag
    return acronym
}

export function address(...children) {
    
    //first create the Tag
    var address = document.createElement("address");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            address.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            address.appendChild(i)
        }
    })
    //send the tag
    return address
}


export function applet(...children) {
    
    //first create the Tag
    var applet = document.createElement("applet");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            applet.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            applet.appendChild(i)
        }
    })
    //send the tag
    return applet
}


export function area(...children) {
    
    //first create the Tag
    var area = document.createElement("area");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            area.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            area.appendChild(i)
        }
    })
    //send the tag
    return area
}


export function b(...children) {
    
    //first create the Tag
    var b = document.createElement("b");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            b.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            b.appendChild(i)
        }
    })
    //send the tag
    return b
}


export function base(...children) {
    
    //first create the Tag
    var base = document.createElement("base");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            base.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            base.appendChild(i)
        }
    })
    //send the tag
    return base
}


export function basefont(...children) {
    
    //first create the Tag
    var basefont = document.createElement("basefont");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            basefont.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            basefont.appendChild(i)
        }
    })
    //send the tag
    return basefont
}


export function bdo(...children) {
    
    //first create the Tag
    var bdo = document.createElement("bdo");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            bdo.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            bdo.appendChild(i)
        }
    })
    //send the tag
    return bdo
}


export function big(...children) {
    
    //first create the Tag
    var big = document.createElement("big");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            big.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            big.appendChild(i)
        }
    })
    //send the tag
    return big
}


export function blockquote(...children) {
    
    //first create the Tag
    var blockquote = document.createElement("blockquote");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            blockquote.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            blockquote.appendChild(i)
        }
    })
    //send the tag
    return blockquote
}


export function body(...children) {
    
    //first create the Tag
    var body = document.createElement("body");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            body.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            body.appendChild(i)
        }
    })
    //send the tag
    return body
}


export function br(...children) {
    
    //first create the Tag
    var br = document.createElement("br");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            br.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            br.appendChild(i)
        }
    })
    //send the tag
    return br
}


export function button(...children) {
    
    //first create the Tag
    var button = document.createElement("button");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            button.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            button.appendChild(i)
        }
    })
    //send the tag
    return button
}


export function caption(...children) {
    
    //first create the Tag
    var caption = document.createElement("caption");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            caption.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            caption.appendChild(i)
        }
    })
    //send the tag
    return caption
}


export function center(...children) {
    
    //first create the Tag
    var center = document.createElement("center");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            center.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            center.appendChild(i)
        }
    })
    //send the tag
    return center
}


export function cite(...children) {
    
    //first create the Tag
    var cite = document.createElement("cite");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            cite.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            cite.appendChild(i)
        }
    })
    //send the tag
    return cite
}


export function code(...children) {
    
    //first create the Tag
    var code = document.createElement("code");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            code.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            code.appendChild(i)
        }
    })
    //send the tag
    return code
}


export function col(...children) {
    
    //first create the Tag
    var col = document.createElement("col");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            col.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            col.appendChild(i)
        }
    })
    //send the tag
    return col
}


export function colgroup(...children) {
    
    //first create the Tag
    var colgroup = document.createElement("colgroup");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            colgroup.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            colgroup.appendChild(i)
        }
    })
    //send the tag
    return colgroup
}


export function dd(...children) {
    
    //first create the Tag
    var dd = document.createElement("dd");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            dd.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            dd.appendChild(i)
        }
    })
    //send the tag
    return dd
}


export function del(...children) {
    
    //first create the Tag
    var del = document.createElement("del");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            del.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            del.appendChild(i)
        }
    })
    //send the tag
    return del
}


export function dfn(...children) {
    
    //first create the Tag
    var dfn = document.createElement("dfn");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            dfn.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            dfn.appendChild(i)
        }
    })
    //send the tag
    return dfn
}


export function dir(...children) {
    
    //first create the Tag
    var dir = document.createElement("dir");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            dir.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            dir.appendChild(i)
        }
    })
    //send the tag
    return dir
}


export function div(...children) {
    
    //first create the Tag
    var div = document.createElement("div");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            div.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            div.appendChild(i)
        }
    })
    //send the tag
    return div
}


export function dl(...children) {
    
    //first create the Tag
    var dl = document.createElement("dl");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            dl.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            dl.appendChild(i)
        }
    })
    //send the tag
    return dl
}


export function dt(...children) {
    
    //first create the Tag
    var dt = document.createElement("dt");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            dt.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            dt.appendChild(i)
        }
    })
    //send the tag
    return dt
}


export function em(...children) {
    
    //first create the Tag
    var em = document.createElement("em");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            em.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            em.appendChild(i)
        }
    })
    //send the tag
    return em
}


export function fieldset(...children) {
    
    //first create the Tag
    var fieldset = document.createElement("fieldset");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            fieldset.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            fieldset.appendChild(i)
        }
    })
    //send the tag
    return fieldset
}


export function font(...children) {
    
    //first create the Tag
    var font = document.createElement("font");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            font.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            font.appendChild(i)
        }
    })
    //send the tag
    return font
}


export function form(...children) {
    
    //first create the Tag
    var form = document.createElement("form");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            form.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            form.appendChild(i)
        }
    })
    //send the tag
    return form
}


export function frame(...children) {
    
    //first create the Tag
    var frame = document.createElement("frame");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            frame.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            frame.appendChild(i)
        }
    })
    //send the tag
    return frame
}


export function frameset(...children) {
    
    //first create the Tag
    var frameset = document.createElement("frameset");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            frameset.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            frameset.appendChild(i)
        }
    })
    //send the tag
    return frameset
}


export function h1(...children) {
    
    //first create the Tag
    var h1 = document.createElement("h1");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            h1.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            h1.appendChild(i)
        }
    })
    //send the tag
    return h1
}


export function h2(...children) {
    
    //first create the Tag
    var h2 = document.createElement("h2");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            h2.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            h2.appendChild(i)
        }
    })
    //send the tag
    return h2
}


export function h3(...children) {
    
    //first create the Tag
    var h3 = document.createElement("h3");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            h3.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            h3.appendChild(i)
        }
    })
    //send the tag
    return h3
}


export function h4(...children) {
    
    //first create the Tag
    var h4 = document.createElement("h4");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            h4.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            h4.appendChild(i)
        }
    })
    //send the tag
    return h4
}


export function h5(...children) {
    
    //first create the Tag
    var h5 = document.createElement("h5");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            h5.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            h5.appendChild(i)
        }
    })
    //send the tag
    return h5
}


export function h6(...children) {
    
    //first create the Tag
    var h6 = document.createElement("h6");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            h6.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            h6.appendChild(i)
        }
    })
    //send the tag
    return h6
}


export function head(...children) {
    
    //first create the Tag
    var head = document.createElement("head");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            head.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            head.appendChild(i)
        }
    })
    //send the tag
    return head
}


export function hr(...children) {
    
    //first create the Tag
    var hr = document.createElement("hr");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            hr.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            hr.appendChild(i)
        }
    })
    //send the tag
    return hr
}


export function html(...children) {
    
    //first create the Tag
    var html = document.createElement("html");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            html.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            html.appendChild(i)
        }
    })
    //send the tag
    return html
}


export function i(...children) {
    
    //first create the Tag
    var i = document.createElement("i");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            i.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            i.appendChild(i)
        }
    })
    //send the tag
    return i
}


export function iframe(...children) {
    
    //first create the Tag
    var iframe = document.createElement("iframe");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            iframe.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            iframe.appendChild(i)
        }
    })
    //send the tag
    return iframe
}


export function img(...children) {
    
    //first create the Tag
    var img = document.createElement("img");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            img.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            img.appendChild(i)
        }
    })
    //send the tag
    return img
}


export function input(...children) {
    
    //first create the Tag
    var input = document.createElement("input");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            input.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            input.appendChild(i)
        }
    })
    //send the tag
    return input
}


export function ins(...children) {
    
    //first create the Tag
    var ins = document.createElement("ins");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            ins.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            ins.appendChild(i)
        }
    })
    //send the tag
    return ins
}


export function isindex(...children) {
    
    //first create the Tag
    var isindex = document.createElement("isindex");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            isindex.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            isindex.appendChild(i)
        }
    })
    //send the tag
    return isindex
}


export function kbd(...children) {
    
    //first create the Tag
    var kbd = document.createElement("kbd");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            kbd.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            kbd.appendChild(i)
        }
    })
    //send the tag
    return kbd
}


export function label(...children) {
    
    //first create the Tag
    var label = document.createElement("label");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            label.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            label.appendChild(i)
        }
    })
    //send the tag
    return label
}


export function legend(...children) {
    
    //first create the Tag
    var legend = document.createElement("legend");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            legend.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            legend.appendChild(i)
        }
    })
    //send the tag
    return legend
}


export function li(...children) {
    
    //first create the Tag
    var li = document.createElement("li");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            li.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            li.appendChild(i)
        }
    })
    //send the tag
    return li
}


export function link(...children) {
    
    //first create the Tag
    var link = document.createElement("link");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            link.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            link.appendChild(i)
        }
    })
    //send the tag
    return link
}


export function map(...children) {
    
    //first create the Tag
    var map = document.createElement("map");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            map.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            map.appendChild(i)
        }
    })
    //send the tag
    return map
}


export function menu(...children) {
    
    //first create the Tag
    var menu = document.createElement("menu");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            menu.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            menu.appendChild(i)
        }
    })
    //send the tag
    return menu
}


export function meta(...children) {
    
    //first create the Tag
    var meta = document.createElement("meta");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            meta.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            meta.appendChild(i)
        }
    })
    //send the tag
    return meta
}


export function noframes(...children) {
    
    //first create the Tag
    var noframes = document.createElement("noframes");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            noframes.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            noframes.appendChild(i)
        }
    })
    //send the tag
    return noframes
}


export function noscript(...children) {
    
    //first create the Tag
    var noscript = document.createElement("noscript");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            noscript.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            noscript.appendChild(i)
        }
    })
    //send the tag
    return noscript
}


export function object(...children) {
    
    //first create the Tag
    var object = document.createElement("object");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            object.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            object.appendChild(i)
        }
    })
    //send the tag
    return object
}


export function ol(...children) {
    
    //first create the Tag
    var ol = document.createElement("ol");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            ol.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            ol.appendChild(i)
        }
    })
    //send the tag
    return ol
}


export function optgroup(...children) {
    
    //first create the Tag
    var optgroup = document.createElement("optgroup");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            optgroup.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            optgroup.appendChild(i)
        }
    })
    //send the tag
    return optgroup
}


export function option(...children) {
    
    //first create the Tag
    var option = document.createElement("option");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            option.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            option.appendChild(i)
        }
    })
    //send the tag
    return option
}


export function p(...children) {
    
    //first create the Tag
    var p = document.createElement("p");
    
    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            p.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            p.appendChild(i)
        }
    })
    //send the tag
    return p
}


export function param(...children) {
    
    //first create the Tag
    var param = document.createElement("param");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            param.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            param.appendChild(i)
        }
    })
    //send the tag
    return param
}


export function pre(...children) {
    
    //first create the Tag
    var pre = document.createElement("pre");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            pre.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            pre.appendChild(i)
        }
    })
    //send the tag
    return pre
}


export function q(...children) {
    
    //first create the Tag
    var q = document.createElement("q");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            q.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            q.appendChild(i)
        }
    })
    //send the tag
    return q
}


export function s(...children) {
    
    //first create the Tag
    var s = document.createElement("s");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            s.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            s.appendChild(i)
        }
    })
    //send the tag
    return s
}


export function samp(...children) {
    
    //first create the Tag
    var samp = document.createElement("samp");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            samp.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            samp.appendChild(i)
        }
    })
    //send the tag
    return samp
}


export function script(...children) {
    
    //first create the Tag
    var script = document.createElement("script");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            script.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            script.appendChild(i)
        }
    })
    //send the tag
    return script
}


export function select(...children) {
    
    //first create the Tag
    var select = document.createElement("select");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            select.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            select.appendChild(i)
        }
    })
    //send the tag
    return select
}


export function small(...children) {
    
    //first create the Tag
    var small = document.createElement("small");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            small.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            small.appendChild(i)
        }
    })
    //send the tag
    return small
}


export function span(...children) {
    
    //first create the Tag
    var span = document.createElement("span");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            span.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            span.appendChild(i)
        }
    })
    //send the tag
    return span
}


export function strike(...children) {
    
    //first create the Tag
    var strike = document.createElement("strike");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            strike.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            strike.appendChild(i)
        }
    })
    //send the tag
    return strike
}


export function strong(...children) {
    
    //first create the Tag
    var strong = document.createElement("strong");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            strong.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            strong.appendChild(i)
        }
    })
    //send the tag
    return strong
}


export function style(...children) {
    
    //first create the Tag
    var style = document.createElement("style");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            style.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            style.appendChild(i)
        }
    })
    //send the tag
    return style
}


export function sub(...children) {
    
    //first create the Tag
    var sub = document.createElement("sub");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            sub.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            sub.appendChild(i)
        }
    })
    //send the tag
    return sub
}


export function sup(...children) {
    
    //first create the Tag
    var sup = document.createElement("sup");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            sup.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            sup.appendChild(i)
        }
    })
    //send the tag
    return sup
}


export function table(...children) {
    
    //first create the Tag
    var table = document.createElement("table");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            table.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            table.appendChild(i)
        }
    })
    //send the tag
    return table
}


export function tbody(...children) {
    
    //first create the Tag
    var tbody = document.createElement("tbody");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            tbody.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            tbody.appendChild(i)
        }
    })
    //send the tag
    return tbody
}


export function td(...children) {
    
    //first create the Tag
    var td = document.createElement("td");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            td.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            td.appendChild(i)
        }
    })
    //send the tag
    return td
}


export function textarea(...children) {
    
    //first create the Tag
    var textarea = document.createElement("textarea");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            textarea.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            textarea.appendChild(i)
        }
    })
    //send the tag
    return textarea
}


export function tfoot(...children) {
    
    //first create the Tag
    var tfoot = document.createElement("tfoot");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            tfoot.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            tfoot.appendChild(i)
        }
    })
    //send the tag
    return tfoot
}


export function th(...children) {
    
    //first create the Tag
    var th = document.createElement("th");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            th.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            th.appendChild(i)
        }
    })
    //send the tag
    return th
}


export function thead(...children) {
    
    //first create the Tag
    var thead = document.createElement("thead");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            thead.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            thead.appendChild(i)
        }
    })
    //send the tag
    return thead
}


export function title(...children) {
    
    //first create the Tag
    var title = document.createElement("title");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            title.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            title.appendChild(i)
        }
    })
    //send the tag
    return title
}


export function tr(...children) {
    
    //first create the Tag
    var tr = document.createElement("tr");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            tr.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            tr.appendChild(i)
        }
    })
    //send the tag
    return tr
}


export function tt(...children) {
    
    //first create the Tag
    var tt = document.createElement("tt");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            tt.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            tt.appendChild(i)
        }
    })
    //send the tag
    return tt
}


export function u(...children) {
    
    //first create the Tag
    var u = document.createElement("u");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            u.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            u.appendChild(i)
        }
    })
    //send the tag
    return u
}


export function ul(...children) {
    
    //first create the Tag
    var ul = document.createElement("ul");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            ul.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            ul.appendChild(i)
        }
    })
    //send the tag
    return ul
}


export function variable(...children) {
    
    //first create the Tag
    var tag = document.createElement("var");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            tag.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            tag.appendChild(i)
        }
    })
    //send the tag
    return tag
}


export function nav(...children) {
    
    //first create the Tag
    var tag = document.createElement("nav");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            tag.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            tag.appendChild(i)
        }
    })
    //send the tag
    return tag
}


export function section(...children) {
    
    //first create the Tag
    var tag = document.createElement("section");

    //now populate it with children
    children.forEach(i => {
        if ( typeof(i) == "number" || typeof(i) == "string" ) {

            tag.appendChild(
                document.createTextNode(`${i}`)
            )

        } else {
            tag.appendChild(i)
        }
    })
    //send the tag
    return tag
}