javascript - jQueryMobile 和 javascript 文件包含 : potential risks

Question

我有一个 jQueryMobile 应用程序，其中有多个链接在一起的单页面。其中一些页面使用常见的 javascript 文件。因此，我目前仅在需要它们的页面中导入这些 JavaScript。例如:

页面 A -> 包含 fileutils.js 并具有指向页面 B 的链接页面 B -> 包含 fileutils.js

用户从页面A点击页面B，是否存在多次导入fileutils.js并多次执行其代码的风险？

提前致谢

Answer 1

你不用担心。让我向您解释 jQuery Mobile 的工作原理。

您所拥有的称为多HTML页面模板。在这种情况下，只有初始 HTML 可以包含多个 data-role="page" 页面，每个其他后续页面只能包含一个 data-role="page" 页面。

第一页已初始化，已完全加载到 DOM 中。该 HTML 页面成为 future 页面加载的骨架。由于它已完全加载，因此可以在内部容纳多个 data-role="page" 页面。

初始化下一页时，jQuery Mobile 将删除所有内容并仅加载 data-role="page" 内容。其他所有内容都将被丢弃，包括 HEAD 内容。更重要的是，只会加载第一个 data-role="page" 页面，这意味着您不能拥有多个 data- role="page" 页面内。

这意味着，如果您在后续页面中有自定义 JavaScript，则它必须位于 data-role="page" div 内，否则 jQuery Mobile 将丢弃它。

这在标准 AJAX 加载打开的情况下有效，这是默认状态。如果关闭 AJAX 加载，jQuery Mobile 将像正常页面一样加载页面，并且每个后续页面将替换 DOM 中的前一个页面。

关于您的其他问题，由于这种架构，相同的 js 文件永远不会初始化多次。但还有另一个问题，您需要小心事件绑定(bind)。由于这种特定的架构，事件可以绑定(bind)多次。因此，您需要使用 pageinit 页面事件来初始化每个页面的 javascript。这个问题还有其他几种解决方案，但我只会在您愿意的情况下描述它们。