JSFiddle - React, Tailwind, and code Playground

by phloe

HTML

<div id="foo">uses dom event method</div>

<div id="bar">uses primitive onclick</div>

CSS

div {
    width: 100px;
    height: 100px;
    margin: 10px;
    background-color: #CCC;
}

JavaScript

var addEvent = (window.attachEvent) ?
    function (element, event, func) {
        element.attachEvent("on" + event, func);
    } :
    function (element, event, func) {
        element.addEventListener(event, func, null);
    };



var foo = document.getElementById("foo");
addEvent(foo, "click", function () {
    alert("hello world");
});

foo.parentNode.removeChild(foo);

setTimeout(function () {
    document.body.appendChild(foo);
}, 500);




var bar = document.getElementById("bar");
bar.onclick = function () {
    alert("hello world");
};

bar.parentNode.removeChild(bar);

setTimeout(function () {
    document.body.appendChild(bar);
}, 500);