如何为有和没有javascript支持的浏览器编写Jquery Mobile应用程序?

时间:2011-01-07 00:57:32

标签: javascript jquery jquery-mobile progressive-enhancement graceful-degradation

我正试图围绕jQuery Mobile。我的目标是构建一个非常快速的应用程序,其外观和感觉尽可能接近本机应用程序(至少对于现代设备)。

我知道在页面之间导航有两种方式:

  1. 将每个页面作为单独的页面加载并链接到具有常规html锚点的其他页面。

  2. 将所有(或多个)页面放在一个网页上,并通过javascript($ .mobile.changePage(方法)和类似的api函数在它们之间导航。

  3. 第一种方法应该适用于所有浏览器,但由于每次页面转换之间存在延迟,因此执行效果很差。

    第二个看起来应该快得多,所以我肯定更喜欢这种方法。但是,如果没有javascript支持,移动设备浏览器的工作原理如何?它似乎违反了jQuery Mobile的目标,即为C级浏览器提供优雅降级的体验。

    在我看来,我需要实施我的应用两次,一次针对支持javascript的浏览器进行了优化,一次针对没有浏览器的浏览器?使用可能是另一种选择,但看起来更加混乱。

    接近这种困境的推荐方法是什么?还有什么我没有注意到的吗?

    谢谢,

    阿德里安

2 个答案:

答案 0 :(得分:2)

首先:你的观点2错了。

请参阅Local, internal linked "pages" in here并仔细阅读。链接href="#pageelementid"可以正常使用并且可以在任何支持HTML4的浏览器中使用[在某些情况下可能需要<a name="pageelementid">,我不再确定],唯一的区别是所有页面都可见马上。

第二件事是,如果你使用数字1的方式,它看起来也会很好。它会加载,是的,但在启用javascript的浏览器中,它加载了AJAX,并且页面之间没有令人讨厌的闪烁。此外 - 显示“加载”弹出窗口。

jQuery Mobile应该让你用一些纯粹而简单的html创建一个没有任何JS的应用程序。 JQM本身对页面进行了增强,使其看起来很好并使用了AJAX。尝试创建一个可以在每个浏览器中运行的应用程序(我的灵感:lynx)并使用JQM标记。您愿意编写的任何JavaScript都应该作为一种增强功能 - 使其更好,而不是让它完全有效。

祝你好运!

答案 1 :(得分:0)

目前支持较小浏览器的想法是不要优雅地降级,而是要提升。如果你从头开始构建网站,不用javascript工作,然后再增强它,那么你几乎知道网站会工作(而不是修复它或建立一个辅助网站)。 / p>

关于您指定的两个选项,如果我的带宽有限,并且很多人每月的下载量有限,那么第一个将是我作为移动用户的偏好。

将所有页面集中到一个大文件中似乎是一个好主意(已下载),但您可能会遇到某些手机的内存限制。如果他们想要做的只是访问两页,他们为什么要被迫下载整个网站呢?