JSFiddle - React, Tailwind, and code Playground
by Vitaliy
CSS
.img-responsive{
display:block;
width:100%;
height:auto;
}
#wrap{
width:200px;
height:200px;
margin:0 auto;
text-align:center;
}
JavaScript
function create(tagName, className, id, textNode, url, alt){
this.exec = function(){
if(!tagName)
return false;
var el = document.createElement(tagName);
className ? el.className = className : false;
id ? el.id = id : false;
textNode ? (el.appendChild(document.createTextNode(textNode))) : false;
url ? el.src = url : false;
alt ? el.alt = alt : false;
return el;
}
}
NEW = function(constr, args) {
var ist = {};
ist.prototype = Object.create(constr.prototype);
ist.prototype.constr = ist;
constr.apply(ist,args);
return ist;
};
var div = NEW(create, ['div', false, 'wrap', 'котик']).exec();
var img = NEW(create, ['img', 'img-responsive', false, false,'http://i.dailymail.co.uk/i/pix/2014/10/06/1412613364603_wps_17_SANTA_MONICA_CA_AUGUST_04.jpg', 'grumpy cat']).exec();
div.appendChild(img);
document.body.appendChild(div)