Skip to content

Instantly share code, notes, and snippets.

@komagata
Last active September 22, 2017 11:12
Show Gist options
  • Save komagata/94533293aa037d205b081e03529d4a86 to your computer and use it in GitHub Desktop.
Save komagata/94533293aa037d205b081e03529d4a86 to your computer and use it in GitHub Desktop.
jQueryを使わず、動的にイベントリスナを追加する。
let elements = document.getElementsByTagName("div");
Array.from(elements, (element) => {
if (element.classList.contains(".foo")) {
element.addEventListener("click", () => {
console.log("FOO!");
})
}
});
@kjirou
Copy link

kjirou commented Sep 22, 2017

コードはこの辺かな?(まだ読んでない
https://github.com/jquery/jquery/blob/master/src/event.js#L37

@kjirou
Copy link

kjirou commented Sep 22, 2017

なんか同僚に聞いたら、イベントのバブルアップを使って

document.body.addEventListener('click', function(event) {
  // 実際に click された要素
  const el = event.target;

  if (elにfooクラスがついてたら) {
    fooHandler();
  }
});

みたいなことすればできるんじゃねって言われた。

@kjirou
Copy link

kjirou commented Sep 22, 2017

でも、これもYouのやつもやめた方がいいと思います(小声

@kjirou
Copy link

kjirou commented Sep 22, 2017

jQuery のコードは途中で心が折れたので読んでませんが、先の例で ul.js-list だけにイベントがついてるので、やっぱりバブルアップを使ってそうと思った。

image

でも止めた方が・・・

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment