【问题标题】:The AJAX response: Data (JSON, XML) or HTML snippet? [closed]AJAX 响应:数据(JSON、XML)还是 HTML 片段? [关闭]
【发布时间】:2010-10-26 09:55:39
【问题描述】:

我只是想知道 AJAX 响应的“理想”输出格式是什么?使用某些客户端 JavaScript 模板引擎将纯数据(JSON、XML)渲染到页面中?还是“按原样”呈现到页面中的 HTML sn-p?

您的偏好是什么?为什么?

【问题讨论】:

    标签: html xml ajax json client-server


    【解决方案1】:

    在大多数情况下,您只需要发送 JSON(或适当的 XML,我以 JSON 为例)。

    • 如果您要发送股票报价等数据,请使用 JSON。
    • 如果您想保持网络层非常精简,请发送纯 JSON 数据,让客户端完成添加标记的繁重工作。
    • 如果客户端页面是持久的,则发送 JSON。然后,客户端可以向 Person.Name 发送问候语。它可以刷新 Person.Score 或显示一个表单来编辑 Person.Status,所有这些都只处理一个 Person 对象。
    • 如果您要公开 Web API,显然使用 JSON,以便客户端可以使用它做任何他们想做的事情。

    话虽如此,我真的不喜欢从 JavaScript 生成 HTML。这是一场维护噩梦,我根本不喜欢将两者混为一谈。那么,如果您发送的只是 JSON,如何避免在 JavaScript 中生成 HTML?如果你正在处理 Person(s) 对象,当你第一次渲染页面时,你会这样渲染它:

    ...
    <div class="person display">
        <div class="name"></div>
        <div class="status"></div>
        <div class="score"></div>
    </div>
    ...
    

    当您通过 AJAX 获取人员数据时,只需填充上述 DOM 结构即可。

    如果您希望显示多个 Person 的信息,则不应直接填充 DOM 结构,您应该克隆它然后填充它。这样您的模板将保持完整,您可以重复使用它。

    【讨论】:

      【解决方案2】:

      这在很大程度上取决于将使用哪些数据:

      用于混搭和网络服务

      对于将在您的应用程序中和外部使用的数据,切勿使用 HTML:难以解析,难以使其适合其他结构。

      如果数据很少,比如为小部件更新了一些数据,请使用 JSON,因为它快速且易于使用。

      如果它可以是大量数据,例如搜索查询的结果,请使用 XML,因为它对于大数据分析更加灵活。

      仅供内部使用

      不要费心使用纯 XML。无论如何,批量分析总是在输出之前完成。

      大多数时候,您会想要使用 JSON,因为它比 HTML 更灵活,而且部署起来相当快。

      如果您知道以后不需要处理数据并且布局很复杂,请使用 HTML。在服务器端编写复杂的 HTML 比使用 DOM 容易得多。

      【讨论】:

        【解决方案3】:

        如果您要返回大量 HTML,最好将它们放在服务器端并简单地将其加载到页面中。

        如果您要返回类似一堆键值对来更新 &lt;select&gt; 或类似的东西,最好将其作为 JSON 返回并在客户端构建 HTML。

        【讨论】:

          【解决方案4】:

          对我来说没有“理想”的方式。 当我需要分页并且我已经有了模板客户端时,使用纯 JSON 和 jTemplates 使用 jQuery 进行客户端渲染。

          当我必须实现对服务器的简单调用时也使用 JSON:自动完成、就地编辑、保存草稿等。

          当我需要一个新的分支页面片段时,我使用 HTML 渲染:加载模板、向页面添加窗格、渲染自定义控件。

          顺便说一句,我更喜欢 json,因为我们可以切换到客户端对象操作,而不仅仅是一个“更新面板”。

          【讨论】:

            【解决方案5】:

            视情况而定,我更喜欢向客户端发送数据,并使用客户端框架更新页面,因为我有一个可用的。如果我自己写,并且 sn-ps 足够小,我可能会在服务器端做,保持 js 尽可能苗条。

            【讨论】:

              猜你喜欢
              • 2011-03-22
              • 2010-10-30
              • 2010-11-03
              • 1970-01-01
              • 1970-01-01
              • 2021-06-09
              • 1970-01-01
              • 2010-11-26
              相关资源
              最近更新 更多