前端用ajax獲取后端資料，并渲染到頁面怎么弄？-有解無憂

前端用ajax獲取后端資料，并渲染到頁面怎么弄？

uj5u.com熱心網友回復：

看一下ajax基礎就可以了。后臺api定義一個url，只要ajax訪問這個地址就可以獲取到資料，在response里面把回傳的資料顯示到頁面。先和api商量一下資料格式及請求方式等資訊

uj5u.com熱心網友回復：

參考 1 樓三歲打醬油的回復:

看一下ajax基礎就可以了。后臺api定義一個url，只要ajax訪問這個地址就可以獲取到資料，在response里面把回傳的資料顯示到頁面。先和api商量一下資料格式及請求方式等資訊

嗯，我去了解一下，謝謝

uj5u.com熱心網友回復：

jquery的api中可以找到使用jquery的方式實作

uj5u.com熱心網友回復：

參考 3 樓菜鳥的自我素養的回復:

jquery的api中可以找到使用jquery的方式實作

嗯，已經解決了，現在又有layui的一些東西了，你有了解嗎？ill

uj5u.com熱心網友回復：

$.ajax({
type:"POST",
url:url,
data:data,
datatype:'json',
success:function(res){//res后臺回傳的資料
//layer插件---提示
layer.msg(res.msg);
}
}
});

uj5u.com熱心網友回復：

參考 5 樓鄭小木的回復:

$.ajax({
type:"POST",
url:url,
data:data,
datatype:'json',
success:function(res){//res后臺回傳的資料
//layer插件---提示
layer.msg(res.msg);
}
}
});

這個弄出來了，但渲染的時候是只能用拼接的方式嗎？

uj5u.com熱心網友回復：

資料拿到了之后，大致有以下思路可以來渲染：
1.你說的沒錯，拼接就完事了，大多通過jQuery的append、after這些方法拼上去
2.插入樣式的話，事先設計好class內容，為元素添加class類即可
3.利用js原生的createElement、appendChild之類的方法
4.利用框架，諸如Angular，Vue，Bootstrap Table之類的js都有已經寫好的基本UI內容，指定資料源（一般是JSON）就可以直接看到渲染效果，其它類似的用Echarts、Highcharts也是可以指定資料源的，看你需要什么樣的渲染效果了

uj5u.com熱心網友回復：

參考 7 樓 Desatiny 的回復:

資料拿到了之后，大致有以下思路可以來渲染：
1.你說的沒錯，拼接就完事了，大多通過jQuery的append、after這些方法拼上去
2.插入樣式的話，事先設計好class內容，為元素添加class類即可
3.利用js原生的createElement、appendChild之類的方法
4.利用框架，諸如Angular，Vue，Bootstrap Table之類的js都有已經寫好的基本UI內容，指定資料源（一般是JSON）就可以直接看到渲染效果，其它類似的用Echarts、Highcharts也是可以指定資料源的，看你需要什么樣的渲染效果了

嗯，我用的是layui框架,暫時只能找著一個拼接渲染的方法，我主要是想看看還有么有其他的渲染方法能用到layui上！

uj5u.com熱心網友回復：

首先ajax異步到后端，后端把資料回應回來，然后用success函式進行資料處理，在success中就可以渲染界面了

uj5u.com熱心網友回復：

后端會回傳一個json字串，你可以現在頁面alert出來或者在瀏覽器控制臺列印出來，然后根據你的需要截取資料出來到頁面上

uj5u.com熱心網友回復：

參考 9 樓 ???? 的回復:

首先ajax異步到后端，后端把資料回應回來，然后用success函式進行資料處理，在success中就可以渲染界面了

在success函式中怎樣才能把接收到的資料放在另一個HTML頁面中展示呢？

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/42291.html

標籤：Ajax

上一篇：IDEA無法直接運行JavaWeb專案（tomcat）

下一篇：Vue v-for資料渲染問題