[JS] Day 25 - Event Capture, Propagation, Bubbling and Once

4069 ワード
テキストリンク

demo:


デモサイト

github:


Danji-ya

Day 25 - Event Capture, Propagation, Bubbling and Once


🎯 機能要件

  • の捕獲、伝播、バブルについて説明しましょう.

    • 🚀 学識


    発泡と捕獲から、これは初めて見た内容ではないことがわかりました.

    1回のオプション

    addEventListener('click', function () { ... }, { capture: true,
once: true});
    captureオプションのほかにonceオプションもあります.イベントを再実行せずにイベントを1回だけ実行するオプションです.

    後でボタンを押しても動かない.

    💻 最終コード

    const divs = document.querySelectorAll('div');

function logText(e) {
  console.log(this.classList.value);
//   e.stopPropagation(); // 버블링이 일어나지 않도록
}

[...divs].map(div => div.addEventListener('click', logText, {
  capture: true, // 캡처링 확인 시
  once: true
}));
    [pythonアルゴリズム]#スタック
    [Javascript]エンコーディングなし受講初日