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

Question

我最近开始使用 jQuery 手机。我将它与 Cordova 一起使用。首先，我正在使用 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*****');

我的问题：

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

也欢迎任何其他好的做法。

我已经阅读了很多论坛..但我对此一头雾水。

编辑：

最初问了 3 个问题，但为了更具体，删掉了另外两个问题。 @Gajotres 对所有三个问题都提供了输入.. 这是其他 2..

我们在 JQM 中通过 JavaScript 添加 HTML 好吗？如果我的 HTML 很大，那不是问题吗？
我非常确定 JQuery 移动设备上已经构建了很多优秀的应用程序。我想知道他们通常在这种情况下使用的一些模式。

谢谢

Answer 1

您可以使用某种模板框架，例如 Handlebars.js 或 Jade。这是 jQuery Mobile

的 Handlebars 教程

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

Answer 2

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

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

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

更好的是 AngularJS 使用它自己的模板引擎（模仿 MustacheJS 或 HandlebarJS）。
这是这里最不重要的问题。 jQuery 移动设备已经有了很大的 DOM 印记，无论您以何种方式填充附加内容都没有关系。添加额外的内容只需要几分之一秒（通常是 50 毫秒，我在 2 年前做过一些基准测试），但是页面增强过程将需要更多时间。所以这是这里最大的问题。

基本上，如何附加数据并不重要，更大的问题是附加了多少。
阅读this文章，了解良好jQuery移动页面架构的秘诀。

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

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

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

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

javascript

jquery

html

cordova

jquery-mobile