1、前后端交互简单了解
大型网站前后端是分离的,前端代码在一个服务器上,后端代码在另外一个服务器上。我们平常浏览网页的话是先访问前端服务器,获取静态代码,包括html文档结构、css进行文档渲染,还有一些js代码。
那么后台数据是如何获取呢?是通过js向后台发请求,后台返回数据,然后传给前台动态渲染页面。
本文介绍通过jquery中的ajax进行前后端交互。
2、AJAX简单介绍
AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示。
其实ajax也很简单,要是学习了js,有的项目中有实现这样的效果触发HTML事件,然后改变CSS样式、甚至添加文字等等。但是ajax特殊的是触发事件后,需要通过JS向后台发送请求获取数据然后再将从后台获取的数据进行处理渲染页面
3、实现方式
通过原生JS:略
通过jQuery中的load方法:
语法:$(selector).load(URL,data,callback);
必需的 URL 参数规定您希望加载的 URL。
可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。
可选的 callback 参数是 load() 方法完成后所执行的函数名称。
通过jQuery中的ajax方法:
![](https://img.haomeiwen.com/i15674568/de8d819d93e63f6b.png)
网友评论