javascript - 如何从json中打印jquery中的图像

Question

我试试这个

$.each(json, function(i, mhs) {
      $('<tr/>', {
        html: [$('<td/>', {
          text: mhs.nim
        }), $('<td/>', {
          text: mhs.nama
        }), $('<td/>', {
          text: mhs.alamat
        }), $('<td/>', {
          text: document.write(mhs.foto)
        })]
      }).appendTo('#mhsTable tbody')
    })

但是mhs.foto不在表中

这是我的 json 数据，我将其放入数组中

[{"nim":"E1E113aaa","nama":"AAAAA","alamat":"Jl. aaaa","foto":"<img src=aaa.jpg width=100px height=100px>"},{"nim":"E1E113aaa","nama":"AAAAA","alamat":"Jl. aaaa","foto":"<img src=aaa.jpg width=100px height=100px>"}]

Answer 1

要将 HTML 插入到元素中，请使用 jQuery 的 html() 方法。 text() 将对数据进行编码，并且永远不应使用 document.write。试试这个:

var json = [{
  "nim": "E1E113aaa",
  "nama": "AAAAA",
  "alamat": "Jl. aaaa",
  "foto": "<img src=\"aaa.jpg\" width=\"100px\" height=\"100px\">"
}, {
  "nim": "E1E113aaa",
  "nama": "AAAAA",
  "alamat": "Jl. aaaa",
  "foto": "<img src=\"aaa.jpg\" width=\"100px\" height=\"100px\">"
}]


$.each(json, function(i, mhs) {
  $('<tr/>', {
    html: [$('<td/>', {
      text: mhs.nim
    }), $('<td/>', {
      text: mhs.nama
    }), $('<td/>', {
      text: mhs.alamat
    }), $('<td/>', {
      html: mhs.foto // note the use of 'html' here
    })]
  }).appendTo('#mhsTable tbody')
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="mhsTable">
  <tbody></tbody>
</table>