JSFiddle - React, Tailwind, and code Playground

by NerfAnarchist

HTML

<div id="test"></div>

JavaScript

// jquery createpath (look at console)

function safeSplit(string, delimiter) {
    var strBuffer = '', arrRet = [], i, len;
    
    for (i = 0, len = string.length; i < len; i += 1) {
        if (typeof delimiter === 'object') { // it delimiter is a regex
            if (string[i].match(delimiter)) {
                arrRet.push(strBuffer);
                strBuffer = '';
            }
        } else {
            if (string[i] === delimiter) {
                arrRet.push(strBuffer);
                strBuffer = '';
            }
        }
        
        strBuffer += string[i];
    }
    
    arrRet.push(strBuffer);
    
    return arrRet;
}

function selectorToHTML(strCurrentSelector) {
    var arrCurrentSelector, strCurrentSelectorPart,
        sel_i, sel_len, attr_i, attr_len,
        strTag, strId, arrClass = [], arrAttr = [],
        strHTML = '';
    
    //console.log('1***', arrCurrentSelector);
    
    arrCurrentSelector = safeSplit(strCurrentSelector, /\.|\[|#/);
    
    for (sel_i = 0, sel_len = arrCurrentSelector.length; sel_i < sel_len; sel_i += 1) {      
        // parse the selector
        strCurrentSelectorPart = arrCurrentSelector[sel_i];
        
        //console.log('2***', strCurrentSelector);
        
        if (strCurrentSelectorPart[0] === '.') {
            arrClass.push(strCurrentSelectorPart.substring(1));
            
        } else if (strCurrentSelectorPart[0] === '[') {
            arrAttr.push(strCurrentSelectorPart.substring(1, strCurrentSelectorPart.length - 1).split('='));
            
        } else if (strCurrentSelectorPart[0] === '#') {
            strId = strCurrentSelectorPart.substring(1);
            
        } else {
            strTag = strCurrentSelectorPart;
        }
    }
    
    //console.log('3***', strTag, strId, arrClass, arrAttr);
    strTag = strTag || 'div';
    
    strHTML = '<' + strTag +
        (strId ? ' id="' + strId + '"': '') +
        (arrClass.length > 0 ? ' class="' + arrClass.join(' ') +...