Ajax_原生

	var xmlHttpRequest = null; //声明一个空对象以接收XMLHttpRequest对象
	
	function ajaxSubmit()
	{
		//如果不为null 或者不为 Undefined 就为true
		if(window.ActiveXObject) // IE浏览器,当初微软先在IE中非标准实现(ActiveX实现,ActiveX IE特有),后来其他浏览器用标准的方式实现
		{
			xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
		}
		else if(window.XMLHttpRequest) //除IE外的其他浏览器实现,window下面存在XMLHttpRequest对象. window的子对象
		{
			xmlHttpRequest = new XMLHttpRequest();
		}
		
		if(null != xmlHttpRequest)
		{
			var v1 = document.getElementById("value1ID").value;
			var v2 = document.getElementById("value2ID").value;
			//POST/GET请求,最好大写,与表单提交不一样     请求路径   true:异步提交
			xmlHttpRequest.open("POST", "ajax", true);//准备
			//关联好ajax的回调函数
			//xmlHttpRequest.onreadystatechange : 引用一个事件处理器
			//点一下执行四次,因为状态变化四次
			xmlHttpRequest.onreadystatechange = ajaxCallback;//回调,ajaxCallback:不能有括号:表示函数的引用,加了括号表示函数的执行

			//真正向服务器端发送数据
			//设置表单提交方式:"Content-Type","application/x-www-form-urlencoded"
			xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
			xmlHttpRequest.send("v1=" + v1 + "&v2=" + v2);//POST提交要附加参数
		}
	}
	
	function ajaxCallback()
	{
		if(xmlHttpRequest.readyState == 4)//1 2 3 4 四种状态
		{
			if(xmlHttpRequest.status == 200)//正常响应
			{
				var responseText = xmlHttpRequest.responseText;//服务器回传文本
				
				document.getElementById("div1").innerHTML = responseText;
			}
		}
	}

<input type="button" value="get content from server" onclick="ajaxSubmit();"><br>
    <input type="text" name="value1" id="value1ID"><br>
    <input type="text" name="value2" id="value2ID"><br>
    <div id="div1"></div>

GET情况:

var xmlHttpRequest = null; //声明一个空对象以接收XMLHttpRequest对象
	
	function ajaxSubmit()
	{
		//如果不为null 或者 Undefined 就为true
		if(window.ActiveXObject) // IE浏览器,当初微软先在IE中非标准实现(ActiveX实现,ActiveX IE特有),后来其他浏览器用标准的方式实现
		{
			xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
		}
		else if(window.XMLHttpRequest) //除IE外的其他浏览器实现,window下面存在XMLHttpRequest对象. window的子对象
		{
			xmlHttpRequest = new XMLHttpRequest();
		}
		
		if(null != xmlHttpRequest)
		{
			//POST/GET请求,最好大写,与表单提交不一样     请求路径   true:异步提交
			xmlHttpRequest.open("GET", "ajax", true);//准备
			//关联好ajax的回调函数
			//xmlHttpRequest.onreadystatechange : 引用一个事件处理器
			//点一下执行四次,因为状态变化四次
			xmlHttpRequest.onreadystatechange = ajaxCallback;//回调,ajaxCallback:不能有括号:表示函数的引用,加了括号表示函数的执行
			//真正向服务器端发送数据
			xmlHttpRequest.setRequestHeader("pragma","no-cache");
			xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
			xmlHttpRequest.send(null);//如果GET请求 则不用附加参数
			
		}
	}
	
	function ajaxCallback()
	{
		if(xmlHttpRequest.readyState == 4)//1 2 3 4 四种状态
		{
			if(xmlHttpRequest.status == 200)//正常响应
			{
				var responseText = xmlHttpRequest.responseText;//服务器回传文本
				
				document.getElementById("div1").innerHTML = responseText;
			}
		}
	}

<input type="button" value="get content from server" onclick="ajaxSubmit();"><br>
    <input type="text" name="value1" id="value1ID"><br>
    <input type="text" name="value2" id="value2ID"><br>
    <div id="div1"></div>

protected void doGet(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		PrintWriter out = resp.getWriter();
		out.print("HELLO FROM SERVER,GET 提交");
		out.flush();
		out.close();
	}

	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		process(req, resp);
	}

	private void process(HttpServletRequest req, HttpServletResponse resp)
			throws IOException {
		String v1 = req.getParameter("v1");
		String v2 = req.getParameter("v2");
		System.out.println("v1=" + v1 + ", v2=" + v2);
		String v3 = String.valueOf(Integer.valueOf(v1) + Integer.valueOf(v2));

		PrintWriter out = resp.getWriter();
		resp.setHeader("pragma", "no-cache");
		resp.setHeader("cache-control", "no-cache");
		out.println(v3);
		out.flush();
		out.close();
	}