除了通过JavaScript追加之外，还有其他方法可以将动态数据添加到jQuery移动页面中吗?

Is there any other way to add dynamic data into a jQuery Mobile Page than appending through JavaScript?

本文关键字：添加 数据 动态 jQuery 移动 JavaScript 追加 其他 方法      更新时间：2023-09-26

我最近开始使用jQuery Mobile。我和科尔多瓦一起使用它。首先，我正在使用SQLite数据库构建一个简单的混合应用程序。我已经通读了 JQM 的文档。从我在大多数示例中看到的情况来看，页面中的数据完全通过JavaScript输入，如下所示：

我有一个这样的页面：

   <div data-role="page" id="home-rh">
        <div data-role="header" data-theme="a" class="" data-id="header" data-position="fixed">
            <h1>My Holiday Calendar</h1>
        </div>
        <div data-role="content" id="myContent">Hello 2</div>
        <div data-role="footer" data-position="fixed" data-id="footer">
            <div data-role="navbar">
                <ul>
                    <li><a href="#home-all">All Holidays</a></li>
                    <li><a href="#" class="ui-btn-active">RH</a></li>
                    <li><a href="#">CH</a></li>
                </ul>
            </div>
        </div>
    </div>

我知道数据可以通过JavaScript动态添加，如下所示：

$("#myContent").append('****MY HTML goes here*****');

我的问题：

  1. 有没有更好的方法可以在 JQM 中动态地向我的页面添加内容，而不必像上面那样用 JavaScript 代码编写我的 HTML 并附加它？

任何其他良好做法也受到欢迎。

我已经阅读了许多论坛..但无法让我清醒过来。

编辑：

最初问了 3 个问题，但为了更具体地删除了其他两个问题。@Gajotres对所有三个问题都提供了意见。这是其他 2..

  1. 我们在 JQM 中通过 JavaScript 添加 HTML 好吗？如果我的 HTML 很大，这不是问题吗？

  2. 我几乎可以肯定，很多优秀的应用程序都是在JQuery Mobile上构建的。我想知道他们在这种情况下通常使用的一些模式。

谢谢

这些都是好问题，但你在这里使用了错误的框架。不要误会我的意思，像Omar一样，我正在帮助其他人解决jQuery Mobile问题，但你的问题超出了jQuery Mobile的范围。

  1. 有一个更好的方法，但jQuery Mobile将无法正常工作。你需要使用一些MVC框架，目前最好的是AngularJS（这是我的主观感觉;你也可以使用BackboneJS，KnockoutJS或EmberJS）。AngularJS指令将使这一步几乎无痛，它会自动完成所有操作，您根本不需要做任何事情。

    只要你有一些数据源（模型），AngularJS就会自动附加页面数据。这是一个很好的方法，但你需要打开jQuery Mobile页面路由（它与AngularJS路由不兼容）。这样，您将丢失jQuery Mobile转换。

    更好的是，AngularJS使用自己的模板引擎（模仿MustacheJS或HandlebarJS）。

  2. jQuery Mobile已经有一个很大的DOM印记，你用其他内容填充它的方式并不重要。附加其他内容只需要几分之一秒（通常为 50 毫秒，我在 2 年前做了一些基准测试），但页面增强过程需要更多时间。所以这是这里最大的问题。

    基本上，如何附加数据

    并不重要，更大的问题是附加了多少数据。

  3. 如果您想了解一个好的jQuery Mobile页面架构的秘密，请阅读这篇文章。

我的建议是，跳过jQuery Mobile，使用Kendo UI，Ionic Framework或Onsen UI。Kendo UI与jQuery Mobile非常相似，但它有自己的MVC框架。它甚至使用jQuery。或者你可以把它与AngularJS一起使用（他们最近也制作了这个版本）。

Ionic和Onsen UI是完全由AngularJS驱动的移动框架。它们非常快，但你需要花一些时间学习AngularJS。

你可以使用某种模板框架，如Handlebars.js或Jade。这是关于jQuery Mobile的Handlebars的教程

http://www.gajotres.net/using-jquery-mobile-with-handlebars/

相关文章：