捕获元素中的链接
重要性:5
使所有位于 id="contents"
元素内的链接询问用户是否真的要离开。如果他们不离开,则不要跳转。
像这样
细节
- 元素内的 HTML 可能会在任何时候动态加载或重新生成,因此我们无法找到所有链接并为其添加处理程序。使用事件委托。
- 内容可能包含嵌套标签。链接内部也是如此,例如
<a href=".."><i>...</i></a>
。
这是事件委托模式的一个很好的应用。
在现实生活中,我们可以向服务器发送一个“日志”请求,保存访问者离开的位置信息,而不是询问。或者我们可以加载内容并在页面中显示它(如果允许)。
我们只需要捕获 contents.onclick
并使用 confirm
询问用户。一个好主意是使用 link.getAttribute('href')
而不是 link.href
来获取 URL。有关详细信息,请参阅解决方案。