1、定义页面click按钮，通过此按钮触发ajax异步取后台数据功能
<!DOCTYPE html>
<html>
<body>
<div id="demo">
<h2>Let AJAX change this text</h2>
<button type="button" onclick="loadDoc()">Change Content</button>
</div>
</body>
</html>
2、定义函数loadDoc来执行ajax与服务器交互的动作：
function loadDoc() {
//定意思XMLHttpRequest对象
var xhttp = new XMLHttpRequest()
//定义返回状态为成功时的返回结果显示
xhttp.onreadystatechange = function() {
//返回值状态为4或者响应码为200是成功
if (this.readyState == 4 &&this.status == 200) {
//给标签div赋值返回结果responseText
document.getElementById("demo").innerHTML = this.responseText
}
}
//开始执行后台取数据
xhttp.open("GET", "ajax_info.txt", true)
//开始发送请求
xhttp.send()
}
用ajax访问后台方法，获取数据就是后台的数组。如：$.('Back.ashx/GetArr', data, true, function (data) {//访问后台Back.ashx的GetArr()方法var arr=data//data就是后台数组的值})
这里的ajax方法的访问后台路径不要错误，如果不会ajax可以看一下jQuery说明。
一、通用的thymeleaf模板引擎通过returnmodel和view获取后台返回的数据。项目中的pom.xml文件引用了与thymeleaf相关的包。
二、在相应的controller方法中设置要返回的数据。
三、在HTML页面上引用thymeleaf标记。
四、引用controller在HTML标记中返回的数据。
五、返回的controller可以在JS中获取。
