実際の要素ができる前でも処理が書けて便利だからと多用されていた
// jQuery
jQuery(document).on("click","selector", function(e){
// 要素は$(this);
var $el = $(this);
// 処理
});
はpure javascriptだと
// javascript
document.addEventListener('click', function(e){
let el;
if(el = e.target.closest('selector')){
// 要素は e.target.closest('selector')で取ると確実
el;
// 処理
}
});
と書き換えられる。
面倒なのは2点、
- e.currentTargetは常にdocument
- selectorの子孫要素もMatchさせないといけないから要素を取るならclosestを使うと確実