使用 JQUERY 或 Javascript 或任何东西从 JSON 数据创建 HTML 表 [重复]答案

【问题标题】：Create HTML table from JSON data with JQUERY or Javascript or ANYTHING [duplicate]使用 JQUERY 或 Javascript 或任何东西从 JSON 数据创建 HTML 表 [重复]
【发布时间】：2017-07-27 00:57:40
【问题描述】：

可能重复：
Convert JSON array to an HTML table in jQuery

我正在拼命想办法制作这张桌子......

我有 3 个字段需要在同一个 <td> 中，另一个字段本身需要在 <td> 中

我已使用以下代码成功地将带有 JSON 的数据获取到我的页面：

$.ajax({
  url: 'code.php',
  async: false,
  dataType: 'json',
  success: function (json) {
    window.upc = json.upc;
    window.img_name = json.img_name;
    window.quantity = json.quantity;
    window.description = json.description;
  }


});

我怎样才能让这些数据按照我的意愿进行格式化？

|文字|图片|
|TEXT|去|
|TEXT|这里|

【问题讨论】：

我不认为它是重复的，他的数据结构不同，并且可能会像该问题的答案所暗示的那样使用 jqGrid。
@Devin：看看 jquery.templ，它是一个可靠的插件（是的，它只是测试版，但它很好）。 api.jquery.com/tmpl.

标签： javascript jquery json html-table

【解决方案1】：

查看：http://icanhazjs.com/

第 1 步 - 定义您的模板

<script id="template" type="text/html">
  <table>
    <tr>
         <td>{{quantity}}{{description}}</td><td>{{img_name}}</td>
    </tr>
  </table>
</script>

第 2 步 - 检索您填充的模板：

$.ajax({
  url: 'code.php',
  async: false,
  dataType: 'json',
  success: function (json) {
     var yourTable = ich.template(json)
  }
});

您可以将变量 yourTable 附加到页面上的任何元素。

【讨论】：

我个人目前不推荐 ich，因为它似乎使用了一个带有危险破坏 HTML 转义实现的 mustache 版本。（当前版本的 mustache 中的转义也被破坏了，只是不允许利用。）
如果问题是 mustache 的版本，那很容易解决...我已经使用 ich 一段时间了，没有遇到转义问题。
我必须包含什么文件才能使用 ich.template？
我还需要它处于“while”类型的循环中，这样我就可以显示随机数量的条目
github.com/andyet/ICanHaz.js/raw/master/ICanHaz.js 是的，您可以在 while 循环中执行此操作，只需将模板附加到对象即可。