要素内のリンクをキャッチする
重要性: 5
id="contents" の要素内のすべてのリンクが、ユーザに本当に離れたいかを尋ねるようにしてください。そして、答えが No の場合は遷移しません。
このようになります:
詳細:
- 要素内の HTML はロードされているかもしれないし、いつでも動的に再作成されるかもしれません。そのため、すべてのリンクを見つけてハンドラを配置することはできません。イベントの移譲を使ってください。
- コンテンツはネストされたタグを持っている場合があります。リンクも同じです。
<a href="/?originalUrl=https%3A%2F%2Fja.javascript.info%2F%26quot%3B..%26quot%3B%26gt%3B%26lt%3Bi%26gt%3B...%26lt%3B%2Fi%26gt%3B%26lt%3B%2Fa%26gt%3B%253C%2Fcode">.
これはイベント移譲パターンを大いに活用してものです。
実際には、尋ねる代わりに、訪問者がどこから離れたかに関する情報を保存する "ログ"要求をサーバーに送信できます。 または、コンテンツを読み込んでページに表示することもできます（許可されている場合）。
私たちに必要なことは、contents.onclick をキャッチし、ユーザの確認するために confirm を使うことです。良いアイデアは URL に対して link.href の代わりに、link.getAttribute('href') を使うことです。詳細は解決策を見てください。