Ajax传值及传值的类型

Ajax传值方式两种:POST,GET

客户端传给服务器端的交互的值的形式有三种:字符串、XML、JSON
处理服务器响应:XMLHttpRequest对象提供了两个可以用来访问服务器响应的属性,一个是responseText将响应呈现为一个字符串,另一个responseXML将响应呈现为一个XML对象,其实对返回值的通常写法:通过responseText获取返回的字符串,在通过XDOM的解析器加载后,获取Document对象,在进行其他操作。
var back_val = xmlHttp.responseText;
var xmlDoc = loadXMLString(back_val):
合为一句为:var xmlDoc = xmlHttp.responseXML;  这样可以直接获取Document对象,进行其他操作。

GET方式:
function getXHR(){
  if (window.XmlHttpRequest) {
      return new window.XMLHttpRequest();
  } else if (window.ActiveXObject) {
      return new window.ActiveXObject('Microsoft.XMLHTTP');

  } else {
    alert('您的不能创建XmlHttpRequest')
  }
}
var xhr = getXHR();
xhr.onreadystatechange = function(){
   if (xhr.readyState == 4) {
    if(xhr.status == 200) {
     alert(xhr.responseText);
     } else {
     //alert('请求失败!');
     return false;
    }
}
xhr.open('get', url + '?time=' + time + ‘&username=’ + username, true);
xhr.send(null);
GET方式传值其实就和平时使用超链接传值方式差不多,用?/&方式通过key=value方式传到服务器,服务器通过getParameter的方式来获取值。如果传值中用中文的话,需要进行转码:
xhr.open('get', url + '?time=' + time + '&username=' + encodeURL(username), true);
服务器中接收是可以转回来
String username = request.getParameter('username');
username = new String(username.getBytes(('ISO-8859-1')), 'uft-8');
GET方式总结:用get方式可传送简单数据,但大小一般都限制在1KB下,数据追加到url中发送(http的header传送)。也就是说,浏览器将各个表单字段元素及其数据按照URL参数的格式附加在请求行中的资源路径后面。另外最重要的一点是,它会被客户端的浏览器缓存起来,那么,别人可以从浏览器的历史记录中读取到客户的数据,比较帐号密码,因此get方法在某些情况下,是会带来严重的安全性问题。

POST方式:
前面和get一样的省略
var queryVal = 'time=' + time + '&username = ' + username:
xhr.open('post', url, true);
xhr.setRequstHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send(queryVal);
和GET的不同的是,url上面不用加需要传过去的值,而且需要加上一句xhr.setRequstHeader('Content-Type', 'application/x-www-form-urlencoded'); send方法需要传拼接好的参数作为值,而不是send(null)。
POST总结:使用post方式时,浏览器把各表单字段及其数据作为HTTP消息实体内容发送Web服务器,而不是作为URL地址参数形式传递,所以使用post方式传递的数据量比使用get方式传递的数据量大的多。

复制高人总结的!!由于不在博客园!所以复制过来!!

原文地址:https://www.cnblogs.com/zhangxiaozhong/p/3179430.html