使用jQuery渲染数据的小例子

最新推荐文章于 2023-09-07 11:25:11 发布

日月长·天地阔·闲快活

最新推荐文章于 2023-09-07 11:25:11 发布

阅读量2k

点赞数

分类专栏：前端文章标签： jquery html5 ajax

本文链接：https://blog.csdn.net/u010032977/article/details/124216817

版权

前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

现在应该很少有人使用jQuery了吧！为了回顾以前使用jQuery的经历，现在特意做了一个使用Ajax渲染数据的小例子。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>用户列表</title>
</head>
<body>
  <div id="app">
    <h3>用户列表</h3>
    <table>
      <thead>
        <tr>
          <th>ID</th>
          <th>用户名</th>
        </tr>
      </thead>
      <tbody>
      </tbody>
    </table>
  </div>
</body>
<script src="jquery/dist/jquery.js"></script>
<script>
  jQuery.ajax({
    url: 'http://localhost:8080/user/list',
    success: function (response) {
      response.forEach(function (item) {
        $('#app table tbody').append('<tr>').children().last()
          .append('<td>').children().append(item.id)
          .after('<td>').next().append(item.username);
      });
    }
  })
</script>
</html>