有没有办法加载一个 html 和一个 JSON 对象答案

【问题标题】：Is there a way to load an html and a JSON object有没有办法加载一个 html 和一个 JSON 对象
【发布时间】：2012-01-18 03:46:54
【问题描述】：

我想做的是从单个 AJAX 调用中获取一个 JSON 对象和一个 HTML 视图。

我目前的实现是 JSON 对象隐藏在 html 的某些部分，只是在客户端解析。

这是好的做法吗？有更好的方法吗？

【问题讨论】：

您可以将 JSON 对象编码为 HTML 元素上的数据属性
能否将视图作为字符串存储在 json 对象的键中？这比从 html 视图中解析 json 更容易。

标签： php jquery ajax

【解决方案1】：

返回一个带有 HTML inside 的 JSON 对象：

{ "a": "data", "b" : "data", "view" : "<html>...</html>" }

【讨论】：

【解决方案2】：

我将从 AJAX 调用返回 JSON，并在其中一个 JSON 属性中存储编码的 HTML。似乎比尝试从 HTML 响应中解析 JSON 更简单和稳定。

【讨论】：

【解决方案3】：

另一个选项（因为更改原始请求的内容类型的选项对这里的每个人来说似乎都很明显）是发送自定义 JSON 标头。

XXX-JSON-Payload: {a:1, b:2}

并从 JS 中读取该标头（请参阅 getResponseHeader is not a function 了解执行此操作的 jQuery 方法）。

【讨论】：

【解决方案4】：

您可以通过将 JSON 嵌入到 HTML 元素数据属性中来做到这一点：

假设您的 ajax 调用返回：

<json data-obj='{"my":"json","data":7}'/>
<div>My View</div>

然后下面会加载视图，并从属性中提取数据

<div id="content"></div>
<script>
    $('#content').load('ajax.php', function(data) {
        $(data).siblings('json').remove().data('obj');
    });
</script>

（使用 jQuery v1.7.1 测试）

【讨论】：