javascript和jquary的ajax请求

使用js的ajax请求

ajax全称 Asynchronous JavaScript and XML(异步的JavaScript和XML)。不是一门新技术，是html,css,js,或jq,dom操作的综合运用。
ajax具有异步请求，局部刷新(不是整个网页刷新，只刷新网页某些区域)的特点。
通过ajax局部刷新数据

  //1.创建xmlhttprequest对象，获取当前requst请求
	 var req=new XMLHttpRequest();
   //2.构建url，是用get请求 ，第一个参数是get/post方式的请求，第二个参数是：服务端地址
     //第三个参数：是否是异步请求
  	req.open("get","quaryProduct.do?page="+currentPage+"&order="+order+"&pname="+pname+"
   &type="+type,true);
   //3.发送请求
	 req.send();
   //4.创建相应事件，当readystate的状态发生改变时，触发事件，监听响应回来的数据	 
     req.onreadystatechange=function(){
    	if(req.readyState==4&&req.status==200){
    		
    	    //服务器返回的是json数据 解析json
    		var data=req.responseText;
    		var obj = eval(data);
    		//下面就可以对数据进行操作了，比如显示在页面
    		}

这里面我们使用servlet接收前端传过来的数据。

@WebServlet("/productQuery.do")
public class QueryProductServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		  String page = req.getParameter("page");
		  String order = req.getParameter("order");
		  String pname = req.getParameter("pname");
		 // System.out.println(pname);
		  String type = req.getParameter("type");
		  if(order.equals("1")){
	    		 order="ASC";
	    	  }else{
	    		  order="DESC";
	    	  }
		  int p = Integer.parseInt(page);
		 // System.out.println(page);
		//处理数据，从数据库中查询数据
			 List<Product> list = new ProductImp().search(pname,type,order,(p-1)*5,5);
			//将list转换成String  json
			 String jstr = JSON.toJSONString(list);
			 //响应前端
			 resp.getWriter().write(jstr);
	}  
}

使用jq的ajax请求

  $.post("quaryProduct.do",{"page":currentPage},function(data){
       //后面括号里面定义了数据返回的形式，这面直接写对数据的操作
    },"json");

继续传上面的servlet。

总结

经过比较你会发现使用jquary简单很多。这里的post和get都可以传递数据，不过
get的特点是：请求速度快，安全性低，使用简单，数据量小，不能上传文件。
而post的特点是：请求速度慢，安全性高，稍微复杂，数据量大，能上传文件。