JSFiddle - React, Tailwind, and code Playground

by mesak

HTML

<a>A1</a><a>A2</a><a>A3</a><a>A4</a><a>A5</a>
<div id="debug"></div>

CSS

a{display:none}

JavaScript

function dump(arr,level) {var dumped_text = "";if(!level) level = 0;var level_padding = "";for(var j=0;j<level+1;j++) level_padding += "    ";if(typeof(arr) == 'object') {for(var item in arr) {var value = arr[item];if(typeof(value) == 'object') {dumped_text += level_padding + "'" + item + "' ...\n";dumped_text += dump(value,level+1);} else {dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n";}}}else{dumped_text = "===>"+arr+"<===("+typeof(arr)+")";}return dumped_text;}

function debug(s) {
    var contnet = document.createElement("pre");
    contnet.innerHTML = typeof s == 'string' ? s : dump(s) ;
    document.getElementById('debug').appendChild(contnet);
}
var _each = function (o, fn) {
    if (o && (o.constructor === NodeList)) {
        for (var i = 0, len = o.length; i < len; i++) {
            fn(o[i], i);
        }
    } else if (o && o.constructor === Array) {
        return o.forEach(fn);
    } else if (o && o.constructor === Object) {
        for (x in o) {
            fn(o[x], x);
        }
    }
}

var anLink = document.querySelectorAll('a');
_each( anLink ,function(a,i){
    debug(a.innerHTML )
})
var objData = {'name':'a1','key':'a2'}
_each( objData ,function(v,k){
    debug('key = ' + k +', value = ' + v )
})

_each( ['a','b','c','d','e'] ,function(v,k){
    debug('value = ' + v )
})