AJAX 响应：数据（JSON、XML）还是 HTML 片段？ [关闭]

Posted 2023-03-05

【中文标题】AJAX 响应：数据（JSON、XML）还是 HTML 片段？ [关闭]

【英文标题】：The AJAX response: Data (JSON, XML) or HTML snippet? [closed]

【发布时间】：2010-10-26 09:55:39

【问题描述】：

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

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

【参考方案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，最好将它们放在服务器端并简单地将其加载到页面中。

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

【参考方案4】：

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

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

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

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

【参考方案5】：

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