javascript - イベントバインドをリッスンするネイティブ JS を使用して、より多くのロードされたタグをバインドする方法

Question

一部のプロジェクトでは JS テンプレートを使用していますが、テンプレート内のタグは HTML タグであり、その文字列は正常に実行されません。ページの最初に読み込まれたタグに対してイベント バインディングが実行された後、後から読み込まれたタグが後で読み込まれます。 jQuery が使用されていない限り、イベント バインディングをリッスンして実装するために何を使用すればよいのかわかりません。
プロジェクトではjQueryやzetpoなどのフレームワークは使用できないと規定されているので、質問と同様にお聞きしたいです。

リーリー

Answer 1

イベントの委任、最も基本的なコードは次のとおりです。

リーリー

ドキュメントは他の要素で置き換えることができますが、置き換えられる要素は最初から存在している必要があります。ページのロード後に動的に追加することはできません。

Answer 2

通常イベント委任

Answer 3

イベントの委任は正しいです。端的に言えば、@Waiting for You の回答で原理が説明され、基本的な問題が解決されます。ただし、実際のアプリケーションでは、バブリング プロセス中に発生した要素ではなく、最終的にクリックされた要素しか処理できません。

バブリングプロセスの例を書きました: https://jsfiddle.net/4L7p5drb/1/

リーリー