jQuery を使用しない動的に作成された要素のイベント リスニング

外部ページを操作する場合、動的に生成された要素にイベント リスナーを追加するのは困難な場合があります。このようなシナリオでは、イベント処理の委任が重要です。

1 つの方法は、event.target プロパティを使用して、クリックまたはトリガーされた要素が目的のタイプであるかどうかを確認することです。次に例を示します。

document.querySelector('body').addEventListener('click', function(event) {
  if (event.target.tagName.toLowerCase() === 'li') {
    // Execute desired action on encountered 'li' elements
  }
});

注: このアプローチでは、目的の要素が

注意事項:

• この方法は、標準に準拠したブラウザー (IE9 など) にのみ適用されます。 .
• 古い IE バージョン (IE8 など) の場合、attachEvent を使用した適切なネイティブ関数のカスタム ラッパーが必要になる場合があります。