手把手教你使用Js实现前后台传送Json

原创 年树先生 随笔 前端技术 12157阅读 18 天前 举报

无论使用什么框架都存在着从controller向Html页面或者jsp页面传递数据的问题,最常用的方式是传递Json字符串。以前对这块知识有些模糊,现在整理一下。

【Jquery基本方法】
实现传值常用的是Jquery以及内部封装的ajax。首先看一下jquery的get()和post()语法。get()方法是从服务器获得数据,其主要参数就是获得后台请求地址,以及负责处理的回调函数:
$.get(URL,callback);

post通过HTTP post方法请求数据:
$.post(URL,data,callback);

【spring mvc框架+Jquery ajax】
spring mvc框架的controller通过标注方法向js返回Map<String,Object>类型参数。

jquery ajax获得返回值:

如果在js中定义的参数与持久层定义的javabean保持一致,controller层同样可以接收实体。
【MUI绑定数据实例】
使用jquery很容易获得controller获得的json值,那我们如何操作json值,让其绑定到页面控件呢?首先我们简单理解一下json的结构:

如上面定义的Json对象,{}表示对象,[]表示数组,"" 表示属性或值,: 表示后者是前者的值。
获得到json对象中的值:var name=employees[0].name;
修改:employees[0].name="LiMing";
MUI框架中的应用举例,实现list中添加li 标签:

json格式的数据相对于xml文件来说,传输速度快且稳定,在前端设计中是一种非常不错的选择。
结语

感谢您的观看,如有不足之处,欢迎批评指正。

本次给大家推荐一个免费的学习群,里面概括移动应用网站开发,css,html,webpack,vue node angular以及面试资源等。
对web开发技术感兴趣的同学,欢迎加入Q群:864305860,不管你是小白还是大牛我都欢迎,还有大牛整理的一套高效率学习路线和教程与您免费分享,同时每天更新视频资料。
最后,祝大家早日学有所成,拿到满意offer,快速升职加薪,走上人生巅峰。

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复