zoukankan      html  css  js  c++  java
  • ajax

    XMLHttpRequest取得响应

    var xhr = new XMLHttpRequest();    //创建XMLHttpRequest实例

    xhr.open("GET","get.php?参数",true);       //async 默认为true异步

    xhr.send();                                     //发送请求        //若为post,则构造参数data,用send传

    xhr.onreadystatechange = function(){            //监听readystate属性的状态

         if(xhr.readyState ===4 && xhr.status  ===200){      //readystate为4 服务器接收并处理请求,status为200 返回成功。

                   //想做的事 document.getElementById('searchResult').innerHTML= xhr.responseText;                                                            //responseText 服务器返回的文本数据

            }else{

          alert(xhr.statusText);                            //statusText 服务器返回的状态文本

        }

    };

    新版本HTTP

    1设置http请求的时限:XMLHttpRequest对象,增加了timeout属性:

      xhr.timeout = 3000        //设置时长

      xhr.ontimeout = function(event){alert('请求超时');}     //其ontimeout事件指定回调函数

    2 FormData 对象 模拟表单操作

      var formData = new FormData();

      formData.append('username','张三‘);

      formData.append('id',12345);

      xhr.open('POST',form.action);       //formData=new FormData(form);

      xhr.send(formData);

    3 上传文件  (input[type='file']),

    var formData = new FormData();

    for (var i = 0; i<files.length;i++){

      formData.append('files[]',files[i]);}

    xhr.send(formData);

    4 进度信息 XMLHttpRequest对象,传递数据时有一个progress事件,用来返回进度信息

    下载的progress事件属于XMLHttpRequest对象,上传的progress事件属于XMLHttpRequest.upload对象。

    xhr.onprogress = updateProgress;

    xhr.upload.onprogress = updateProgress;

    function updateProgress(event){

      if (event.lengthComputable){

        var percentComplete = event.loaded / event.total;

        }

      }

    json   存储和交换文本信息的语法,类似XML,采用键值对的方式来组织

    json在js中的解析:

    eval('('+jsondata+')');   //相对不严格,不易出格式上的报错,但会被恶意转换路径

    JSON.parse(jsondata);  //严格json格式,但也不会恶意执行其中的代码

          JSONLink 检测json格式

    {data:[

             {"key":"value"},{"key":"value"},{"key":"value"}

    ]}   //数据

    {"success":true,"msg":'xxx'}   //逻辑

    跨域访问数据:jsonp 只适用于get请求来实现跨域

    HTML5提供的XMLHttpRequest leval2 实现跨域 但IE10不支持

  • 相关阅读:
    git config (21)
    狗狗染头,一举天下成名
    K2使用总结K2简介
    K2使用总结流程设计
    如何组建开发团队谈面试
    如何组建开发团队谈谈团队组成
    如何组建开发团队谈招聘中的牛人
    作业题有感
    js对象学习笔记Function类型和对象
    非常认同的《SEO优化大全》
  • 原文地址:https://www.cnblogs.com/yxiaoqian/p/5746385.html
Copyright © 2011-2022 走看看