javascript - 为什么 WinJS 导航应用程序将 CSS 应用于任何访问的页面?

标签 javascript html windows-store-apps win-universal-app winjs

我开发 WinJS 导航应用程序 (Windows 8.1/WP 8.1),但有一个问题:我已将 .css 文件仅链接到一个 .html 文件,但是当我转到任何其他 .html 页面时,如果它有任何相同的内容,类然后应用程序从我去的第一页应用.css!

  • 我没有将该 .css 链接到主机 (default.html)。
  • 这与我使用哪个 Visual Studio 无关。
  • 我在 WinJS 2.0、3.0 和 4.4.0 中也有同样的错误。

有一个问题:WinJS为什么要这样做?有什么解决办法或解决方法吗?

您可以在 VS2013 或 VS2015 上重现我的问题:zip (调试 Windows 项目,而不是 WindowsPhone)。

最佳答案

当使用 WinJS 导航和页面控件时,“导航”是在 default.html 的单个上下文或任何根应用程序页面中进行 DOM 替换,而不是通过转储 default.html (以及所有 CSS/JS已加载)并初始化了一个新的页面上下文。

这种单页导航模型有几个好处:它保留了全局 JavaScript 上下文,并允许您执行动画/转换以将元素移入和移出页面。如果您确实完全导航到一个新页面,您将重置 JS 上下文,并且始终会导航到空白页面。

正如您所看到的,副作用是在页面导航过程中加载的所有 CSS 都是累积的。也就是说,WinJS 中的“导航”不会重置任何上下文,包括 CSS,这可能很难管理。 有几种方法可以解决这个问题:

  1. 使用全局 CSS 文件并避免使用特定于页面的 CSS,除非您知道某些内容对于页面而言是唯一的。
  2. 确保每个页面都有一个顶级 div,其页面名称类如 <div class="page1">然后使用 .page1 选择器在 CSS 中限定该页面的所有样式。
  3. 具体通过修改<link>来加载和卸载CSS文件页眉中的标签。这实际上是卸载 CSS 的唯一方法,但也意味着重新加载和重新解析 CSS 文件,这将导致页面重新渲染。

一般来说,我认为选项 2 是最好且最便携的。

有关更长的文章,请参阅我的免费电子书 Programming Windows Store Apps with HTML, CSS, and JavaScript, 2nd Edition 第 3 章中的“页面特定样式”部分。 ,我在我的博客上写了类似的 Material ,http://www.kraigbrockschmidt.com/2013/05/02/css-loading-behaviors-winjs-page-controls/ .

关于javascript - 为什么 WinJS 导航应用程序将 CSS 应用于任何访问的页面?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35745974/

相关文章:

javascript - 无法读取未定义的属性 'undefined'?为什么会出现这个错误?

javascript - 是否可以将 Dojo 与其他 JS 框架结合起来?

javascript - 使用 Jquery AJAX 检索 PHP post 请求数据

visual-studio-2012 - 为 Windows 应用商店应用编写脚本创建程序包

authentication - Windows 应用商店应用程序中的域用户身份验证?

c# - 如何在 Windows Phone 8.1 中缓存页面

javascript - 使用 val() 在 jquery 循环中设置 html 字符串的值

javascript - 显示与所需引用相匹配的正确项目

css - 有没有办法在输入类型=颜色中限制对数据列表的选择并禁用其他...选项?

java - 使用 Java 标准库将 HTML 字符转换回文本