JSFiddle - React, Tailwind, and code Playground

by jannis

HTML

<div id="div1" data-popout="{name:test1,style:js,offset:10}"></div>
<div id="div2" data-popout-trigger="test1" data-popout-name="test1" data-popout-style="js" data-popout-offset="10"></div>

JavaScript

var div = $('#div1'),
    data = div.data().popout;

console.log(data, typeof data);

// make it a JS object.
var popout = {};

var regex = /\{?\s*([^\:]+)\s*\:\s*([\w\d]+)\s*\}?/gi;
data = data.split(',');

console.log(data);

$.map(data, function(val, i) {
    console.log(i, "inside function!");
    console.log("Value: ", val, " Type of value:", typeof val, "Length of string:", val.length);
    console.log("Results of regex.exec( val ): ", regex.exec(val));

    // var result = regex.exec( val );
    // console.log( "Key:", result[1] , "Value:", result[2] );
    // popout[ result[1] ] = result[2];
});

console.log(popout, typeof popout);