AJAX 的基本框架

我就是我 2022-09-17 11:18 158阅读 0赞

//创建XMLHttpRequest对象

function getXMLHttpRequest()
    {
     http_request = false;
     if(window.XMLHttpRequest)
     {
      http_request = new XMLHttpRequest();
      if(http_request.overrideMimeType)
       http_request.overrideMimeType("text/xml");
     }
     else
     {
      if(window.ActiveXObject)
      {
       try
       {
        http_request = new ActiveXObject("Msxml2.XMLHTTP");
       }
       catch(e)
       {
        try
        {
         http_request = new ActiveXObject("Microsoft.XMLHTTP");
        }catch(e)
        {
         
        }
       }
      }
     }
     return http_request;
    }
    //发送请求
    /*
     @http_request 异步请求对象
     @url 请求位置
     @method 请求方法
     @content 请求内容 eg. param1=xxx1¶m2=xxx2
     @callBack 请求回调
    */
    function send_request(http_request,url,method,content,callBack)
    {
     if(!http_request)
     {
      alert('无法创建异步请求对象!');
      return;
     }
     http_request.onreadystatechange = callBack;
     if(method.toUpperCase() == 'GET')
     {
      http_request.open(method,url,true);
      http_request.setRequestHeader('Content-Type','text/html;charset=UTF-8');
     }
     else if(method.toUpperCase == 'POST')
     {
      http_request.open(method,url,true);
      http_request.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
     }
     else
     {
      alert('请求方法出错!');
      return;
     }
     http_request.send(content);
    }
    //返回文本的
    function getWebContent()
    {
     var webConReq = getXMLHttpRequest();//ajax不支持跨跨域访问
     send_request(webConReq,'./servlet/testServlet','get',null,
     function()
     {
      if(webConReq.readyState == 4)
      {
       if(webConReq.status == 200)
       {
        var doc = webConReq.responseText;
        if(doc)
        {
         document.getElementById("pageCon").innerHTML = doc;
        }
       }
       else
       {
        alert('请求失败!');
       }
      }
     }
     );
    }
    //返回xml
    function getXml()
    {
     var webConReq = getXMLHttpRequest();//ajax不支持跨跨域访问
     send_request(webConReq,'./NewFile.xml','get',null,
     function()
     {
      if(webConReq.readyState == 4)
      {
       if(webConReq.status == 200)
       {
        var doc = webConReq.responseXML;
        if(doc)
        {
         var root = doc.getElementsByTagName("items")[0];
         var items = root.getElementsByTagName("item");
         var html = '';
         for(var i=0;i<items.length;i++)
         {
          html += "id:" + items[i].getAttribute('id');
          html += " name:" + items[i].getAttribute('name');
         }
         document.getElementById("xml").innerHTML = html;
        }
       }
       else
       {
        alert('请求失败!');
       }
      }
     }
     );
    }
    
      <a href="javascript:getWebContent();">异步获取页面</a> 
      <font id="pageCon"></font><br>
      <a href="javascript:getXml();">异步XML</a> 
      <font id="xml"></font>

发表评论取消回复

表情：

评论列表（有 0 条评论，158人围观）

还没有评论，来说两句吧...

相关阅读

相关 ajax--XML、AJAX简介、express框架使用、AJAX操作的基本步骤

一、XML（可扩展标记语言） XML与HTML类似，不同的是HTML中都是预定义标签，而XML中没有预定义标签，全都是自定义标签，用来表示一些数据。比如有一个学生数据

布满荆棘的人生/ 2024年03月16日 15:05/ 0 赞/ 71 阅读

相关 Ajax的基本使用

Ajax的使用什么是Ajax 接口收集一些接口 Postman接口测试工具 JQuery中的A

男娘i/ 2023年01月21日 13:22/ 0 赞/ 3 阅读

相关 ajax框架

dojo 开源 [http://dojotoolkit.org/][http_dojotoolkit.org] open rico 开源 [http://openri

你的名字/ 2022年09月18日 04:49/ 0 赞/ 132 阅读

相关 AJAX 的基本框架

//创建XMLHttpRequest对象 function getXMLHttpRequest() { http_request = f

我就是我/ 2022年09月17日 11:18/ 0 赞/ 159 阅读

相关 ajax封装框架,封装自己的Ajax框架

Ajax技术就是利用javascript和xml实现异步交互的功能。首先先来介绍一下Ajax相关知识点一、Ajax对象的创建 1、创建Ajax对象的方式 a、第一种

柔情只为你懂/ 2022年09月03日 15:24/ 0 赞/ 260 阅读

相关 jquery框架的ajax,原生ajax和jquery框架ajax的使用

创建一个异步调用对象，XMLHttpRequest 创建一个新的 HTTP 请求，并且指定方法，url 及参数等(XMLHttpRequest.open(‘GET/POST’

我不是女神ヾ/ 2022年09月03日 11:17/ 0 赞/ 193 阅读

相关 Ajax基本原理

Ajax是通过在浏览器和服务器之间添加Ajax中间层，允许浏览器异步发送请求，同时允许动态加载服务器响应。用户的请求不是直接提交给服务器，而是使用XMLHttpRequest异

朴灿烈づ我的快乐病毒、/ 2022年08月22日 13:28/ 0 赞/ 164 阅读

相关 ajax基本语法

一、url 要求为String类型的参数，（默认为当前页地址）发送请求的地址。二、type 要求为String类型的参数，请求方式（post或get）默

╰半橙微兮°/ 2022年06月18日 00:48/ 0 赞/ 181 阅读

相关 $.ajax()的基本语法

代码模版： \[js\] view plain copy print? 1. $.ajax(\{ 2. type: "POST", 3. url: "/login"

淩亂°似流年/ 2022年05月10日 07:48/ 0 赞/ 174 阅读

相关 ajax的基本语法

ajax 基本语法 1.url: 要求为String类型的参数，（默认为当前页地址）发送请求的地址。 2.type: 要求为String类型的参数，请求方式（p

冷不防/ 2021年12月05日 05:59/ 0 赞/ 220 阅读