JSFiddle - React, Tailwind, and code Playground

by Salmin Skenderovic

HTML

<button id="button1">button1</button>
<button id="button2">button2</button>

<input type="file" webkitdirectory="webkitdirectory" />

JavaScript

const button1 = document.querySelector('#button1');
const button2 = document.querySelector('#button2');
const input = document.querySelector('input');


const handleClickAsConst = (e) => {
  console.log('e', e.target.innerText)
}




class MyScope {
  name = "some scope name";
  handleInnerClick = this.handleInnerClick.bind(this);

  constructor() {
    /* this.clickHandler = this.handleInnerClick.bind(this) */

    button1.addEventListener('click', this.handleInnerClick);
    button1.addEventListener('click', this.handleInnerClick);
  }

  handleInnerClick(e) {
    console.log('e', e.target.innerText, this.name)
  }
}

new MyScope();



input.addEventListener("change", (event) => {
  let output = document.getElementById("listing");
  for (const file of event.target.files) {
    console.log(file.name)
  }
});