JSFiddle - React, Tailwind, and code Playground

by Danny Michaelis

HTML

<script src="https://cdn.jsdelivr.net/lodash/4.13.1/lodash.min.js"></script>

JavaScript

Skip to content
This repository
Search
Pull requests
Issues
Gist
 @easilyBaffled
 Watch 1
  Star 51
 Fork 14 HenrikJoreteg/html-parse-stringify
 Code  Issues 5  Pull requests 3  Wiki  Pulse  Graphs
Branch: master Find file Copy pathhtml-parse-stringify/lib/parse-tag.js
7528714  on Dec 17, 2014
@HenrikJoreteg HenrikJoreteg add proper support for void elements even if not closed.
1 contributor
RawBlameHistory     53 lines (48 sloc)  1.19 KB
var attrRE = /([\w-]+)|['"]{1}([^'"]*)['"]{1}/g;

// create optimized lookup object for
// void elements as listed here: 
// http://www.w3.org/html/wg/drafts/html/master/syntax.html#void-elements
var lookup = (Object.create) ? Object.create(null) : {};
lookup.area = true;
lookup.base = true;
lookup.br = true;
lookup.col = true;
lookup.embed = true;
lookup.hr = true;
lookup.img = true;
lookup.input = true;
lookup.keygen = true;
lookup.link = true;
lookup.menuitem = true;
lookup.meta = true;
lookup.param = true;
lookup.source = true;
lookup.track = true;
lookup.wbr = true;

module.exports = function (tag) {
    var i = 0;
    var key;
    var res = {
        type: 'tag',
        name: '',
        voidElement: false,
        attrs: {},
        children: []
    };

    tag.replace(attrRE, function (match) {
        if (i % 2) {
            key = match;
        } else {
            if (i === 0) {
                if (lookup[match] || tag.charAt(tag.length - 2) === '/') {
                    res.voidElement = true;
                }
                res.name = match;
            } else {
                res.attrs[key] = match.replace(/['"]/g, '');
            }
        }
        i++;
    });

    return res;
};
let result = ''
var tag = '<div class=thing other=stuff something=54 quote="me ">';
    result = _.isEqual(parseTag(tag), {
        type: 'tag',
        attrs: {
            class: 'thing',
            other: 'stuff',
            something: '54',
            quote: 'me '
        },
        name: 'div',
        voidElement:...