JSFiddle - React, Tailwind, and code Playground

by fxi

HTML

<script src="https://unpkg.com/@fxi/el"></script>
<div id="target"></div>
<div id="test">
</div>

<span id="res"></span>

JavaScript

const el = El.el;

const elTarget = document.getElementById("target");
const elTest = document.getElementById("test");
const elRes = document.getElementById("res");

const elInput = el('input', {
  style: {
    width: '100%'
  },
  type: 'range',
  value: "2018",
  min: "2002",
  step: 1,
  max: "2018",
  on: ['input', console.log]
});


const elIputTestHTML = `<input type="range" value="2018" min="2002" step="1" max="2018" data-el_id_listener="0.bnkmpj1oi18" style="width: 100%;">`

const elInputHTML = elInput.outerHTML;
const res = elInputHTML === elInput.outerHTML;

elRes.innerText = `Identical string from "el" and  "text" mode : ${res}`;



elTarget.appendChild(elInput);
elTest.innerHTML = elInputHTML;