首先把html页面创建出来
例如:
<form>
<input type="text" name="name">
<input type="text" name="password">
<button>提交<button>
</form>
这个可以请求一个.js资源<script src="js/blog_content.js"></script>
这时就可以在.js中创建ajax
var xhr=XMLhttprequest()
xhr.open('get','/.')再请求一个动态资源
xhr.οnlοad=function(){//接收响应,修改DOM树
}
xhr.send()
转到的动态资源:
1、首先要有注解@Webservlet('/')跟ajax请求的地址一样
2、这个类要继承Httpservlet
3、重写Doget()/Dopost()方法
4、有获取用户输入的参数的步骤:
首先要设置编译
req.setcharacterEncoding("utf-8");
String name=req.getParameter("name");
String password=req.getParameter("password");
5、用会话找到对象:
HttpSession session=req.getSession(false)(false是如果没有session就返回null,有则返回)(true没有创建新的session,返回亲的session,有则返回)
没有参数就相当于req.getsession(true)
User user=(User)session.getArribute("User");session是key-value,传参数(setArribute("User",user))
这时如果没有登录可以重定向:reps.sendRedirect('...');
6、把获取的对象变为json的string类型:
ObjectMapper ob=new ObjectMapper();
String jsonstring =ob.writeValueAsString(result);这里的result是通过service构建出来的(里面是Dao和Service一起构造的)
7、做出响应:
resp.setContentType("application/jason")(这里是json类型)(text/plain)
resp.setcharacterEncoding("utf-8")
resp.getWrite().println(...);
6、ajax的渲染操作
xhr.οnlοad=function(){
var data=JSON.parse(this.responseText)(把json对象转String)
这里面可以重定向:location.assgn('...');
renderAuthor(data.currentUser)
}
这个renderAuthor()方法
function renderAuthor(user ){
document.querySelector('.author-avatar').src=user.avatar//这是图片所以.src
document.querySelector('.author-name').textcontent=user.name//这里所以为.textcontent
document.querySelector('.author-gitt').href=user.gitt这里是超链接所以为.href
}