ajax交互数据

最新推荐文章于 2022-05-14 15:34:22 发布

:-G

最新推荐文章于 2022-05-14 15:34:22 发布

阅读量115

点赞数

分类专栏： js 文章标签： Ajax

本文链接：https://blog.csdn.net/Rookie_Rookieone/article/details/96604625

版权

js 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

下面附上一段加注释的代码：

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>ajax/GET请求</title>
  </head>
  <body>
<input type="button" value="发送" id="but">

    <script>
    window.onload=function(){
      var oBt=document.getElementById("but");
      oBt.onclick=function (ev){
        //1.创建一个异步对象
        //为应对现代所有浏览器，包括IE5和IE6
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          var xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }

        //2.设置请求方式和请求地址
        /*
        method:请求类型：GET 或 post
        url:文件在服务器上的位置
        async：true(异步)或false(同步)
        */
        xmlhttp.open("GET","ajax.txt?t="+(new Date().getTime()),true);

        //3.发送请求
        xmlhttp.send();

        //4.监听状态变化
        xmlhttp.onreadystatechange=function (ev1){
          //5.处理返回的结果
          // 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化
          // 0: 请求未初始化
          // 1: 服务器连接已建立
          // 2: 请求已接收
          // 3: 请求处理中
          // 4: 请求已完成，且响应已就绪
          if(xmlhttp.readyState===4){
            //判断是否请求成功
            if(xmlhttp.status>=200&&xmlhttp.status<300 || xmlhttp.status===304){
              // responseText  获得字符串形式的响应形式
              // responseXML   获得XML形式的响应数据
              console.log(xmlhttp.responseText);
            }else{
              console.log("没有接收服务器返回的数据");
            }
          }
        }

      }
    }
    </script>
  </body>
</html>

代码如有错误或需要更改的地方评论一下，谢谢∩_∩；7

:-G

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ajax交互数据

下面附上一段加注释的代码：<!DOCTYPE html><html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title>ajax/GET请求</title> </head> <body><input ...
复制链接

扫一扫