问

javascript - js怎么用java提供的接口动态更新html页面的内容？

裂爆传说_818 发布于 2022-11-11 22:38

大概是这样子：

java后台传给我一个接口，我怎么从这个接口里面获取数据，并更新前台li列表呢？

$.ajax(function(){
    url:"",
    method:"",
    data:"",
    success:function(){
            
    }
})

怎么写呢？可不可以讲得详细点，谢谢。

7 个回答

ajax, js jquery get() http://www.w3school.com.cn/jq...

2022-11-12 15:34 回答

刘妤劭明馨
patrickhai回答的代码是对的。你可以再搜索了解一下ajax和json。就能够简单的明白了。
```
$.ajax(function(){
    url:"",
    method:"",
    data:"",
    success:function(){
            
    }
})
```
这个是jquery封装的ajax方法。
2022-11-12 15:34 回答

一截藏青线
jQuery+vue，对付这种东西很简单。但是你应该是刚入门的，可能要过段时间才能用吧。

2022-11-12 15:34 回答

采蘑菇的灵的fans
根据返回的数据，写到html上

2022-11-12 15:34 回答

萌新求学
artTemplate 你值得拥有

2022-11-12 15:34 回答

金婉山_461
jQuery
把数据拼成html，放到需要放的地方
比如
1、遍历一下数据，拼成
var html = '<li>...</li><li>...</li><li>...</li>';
2、<ul id="data"> ul标签加个id
$("#data").html(html);

2022-11-12 15:34 回答

萌嗒嗒滴妹妹惹人爱i_121

<!DOCTYPE html>
<html>
<head>
  <title>test</title>
</head>
<body>
  <ul></ul>
<script src="http://code.jquery.com/jquery-3.1.1.min.js?1.2.1"></script>
<script>
  function fill_ul(){
/*    $.ajax(function(){
        url:"",
        method:"",
        data:"",
        success:function(response){//这里是后台返回的数据结果
          response.data.forEach(function(d){
            var space = $('<li><a><img src=""></a><h2>图片名称</h2><p>年份</p><span>价格</span></li>');
            space.find('img').attr('src', d.img_url);
            space.find('h2').text(d.img_name);
            space.find('p').text(d.year);
            space.find('span').text(d.price);
            $('ul').append(space);
          })
        }
    })*/
    var d = {img_url: 'https://img.changker.com/85/af/49/85af492184f6ecc4cffdb5b8e423a07c', img_name: 'img_name', year: 2017, price: 800};//这里假设了你需要循环的对象的结构
    var space = $('<li><a><img src=""></a><h2>图片名称</h2><p>年份</p><span>价格</span></li>');
    space.find('img').attr('src', d.img_url);
    space.find('h2').text(d.img_name);
    space.find('p').text(d.year);
    space.find('span').text(d.price);
    $('ul').append(space);
  }
  $(document).ready(function(){
    fill_ul();
  })
</script>
</body>
</html>

2022-11-12 15:34 回答

k78283381

撰写答案

今天，你开发时遇到什么问题呢？

立即提问

热门标签