Ajax:即"Asynchronous JavaScript and XML"(异步JavaScript和XML),一门综合性的技术:运用JavaScript对象XMLHttpRequest进行异步数据交换;JavaScript操作DOM实现动态效果;运用XHTML+CSS表达信息;XML和XSLT操作数据。此篇文章重点介绍使用XMLHttpRequest对象与服务器端进行异步数据交换。 
    使用方法 
    XMLHttpRequest五步使用法: 
    1.创建对象; 
    2.注册回调函数; 
    3.使用open方法设置和服务器交互的基本信息; 
    4.设置发送的数据,开始和服务器端交互; 
    5.实现回调函数。 
    由于每次应用XMLHttpRequest对象时,都要进行五步操作,因此,可将该对象的使用封装为js文件中,传递部分参数使用其方法就可以完成相应功能,实现如下: 
    //使用封装方法人员只提供http的请求,url地址,数据,成功和失败的回调的方法 
    //1.定义XMLHttpRequest对象的构造方法 
    var MyXMLHttpRequest =function(){ 
    var xmlhttprequest; 
    if(window.XMLHttpRequest){ 
    //IE7,IE8,FireFox,Mozillar,Safari,Opera 
    //alert("IE7,IE8,FireFox,Mozillar,Safari,Opera"); 
    xmlhttprequest = new XMLHttpRequest(); 
    //解决浏览器在服务器端响应由于没有Text头的时候可能无法工作的问题 
    if(xmlhttprequest.overrideMimeType){ 
    xmlhttprequest.overrideMimeType("text/xml"); 
    } 
    }else if(window.ActiveXObject){ 
    //IE6,IE5.5,IE5 
    alert("IE6,IE5.5,IE5"); 
    var activexName =["MSXML2.XMLHTTP","Microsoft.XMLHTTP"]; 
    for (var n=0;n 
    扩展问题 
    1.浏览器缓存 
    2.中文乱码 
    3.跨域访问 
    对于问题1、问题3都可以通过更改url地址的方法得以解决。问题1可在url地址尾添加时间戳,问题3通过代理方式进行解决。只需在send()中的第三步执行前添加相应判断即可: 
    //解决缓存的转换:增加时间戳 
    if(url.indexOf("?") >= 0 ){ 
    url = url + "&t=" + (new Date())。valueOf(); 
    } else { 
    url = url + "?t=" + (new Date())。valueOf(); 
    } 
    //解决跨域的问题 
    if(url.indexOf("http://") >= 0) { 
    url.replace("?","&"); 
    url = "Proxy?url=" + url; 
    } 
    问题3对应代理服务端实现: 
    /** 
    * Handles the HTTP GET method. 
    * 
    * @param request servlet request 
    * @param response servlet response 
    * @throws ServletException if a servlet-specific error occurs 
    * @throws IOException if an I/O error occurs 
    */ 
    @Override 
    protected void doGet(HttpServletRequest request, HttpServletResponse response) 
    throws ServletException, IOException { 
    //获取参数,最后得到请求url地址类似于:url = http://192.168…/AJAX/AJAXServer?aa=11&bb=22&cc=33 
    StringBuilder url = new StringBuilder(); 
    url.append(request.getParameter("url")); 
    //获取访问的跨域地址url = http://192.168…/AJAX/AJAXServer 
    Enumeration enu = request.getParameterNames(); 
    boolean flag = false;       //定义标志变量,表示是否为拼接的第一个参数 
    while(enu.hasMoreElements()){ 
    String paramName = (String) enu.nextElement(); 
    if(!paramName.equals("url")){ 
    String paramValue = request.getParameter(paramName); 
    paramValue = URLEncoder.encode(paramValue,"utf-8"); 
    if(!flag){ 
    url.append("?")。append(paramName)。append("=")。append(paramValue); 
    flag = true; 
    } else { 
    url.append("&")。append(paramName)。append("=")。append(paramValue); 
    } 
    } 
    } 
    response.setContentType("text/html;charset=utf-8"); 
    PrintWriter out = response.getWriter(); 
    if(url != null && url.length() > 0){ 
    URL connectionUrl = new URL(url.toString()); 
    BufferedReader reader = new BufferedReader(new InputStreamReader(connectionUrl.openStream(),"utf-8"));

Ajax核心技术之XMLHttpRequest的更多相关文章

  1. Ajax核心技术代码

    /* @author weichen */ var xhr = ''; function Ajax() { if(window.XMLHttpRequest) { var xhr = new XMLH ...

  2. $.ajax通用格式&&XMLHttpRequest对象属性和方法

    $.ajax({ url: "", type: "POST", async: false, cache:false, //默认true data: {}, da ...

  3. Ajax技术---核心XMLHttpRequest对象

    Ajax 的全称是Asynchronous JavaScript and XML,其中,Asynchronous 是异步的意思,它有别于传统web开发中采用的同步的方式. (一)ajax技术的意义 我 ...

  4. AJAX原理及XMLHttpRequest对象分析

    今天的主题是前端都了解的AJAX,但其中都有哪些知识点,还需要深入分析. 首先揭示AJAX的字面意思,Asynchronous Javascript And XML,通俗点就是“异步Javascrip ...

  5. Ajax中的XMLHttpRequest对象详解

    XMLHttpRequest对象是Ajax技术的核心.在Internet Explorer 5中,XMLHttpRequest对象以ActiveX对象引入,被称之为XMLHTTP,它是一种支持异步请求 ...

  6. Ajax错误 “SCRIPT7002: XMLHttpRequest: 网络错误 0x2ef3, 由于出现错误 00002ef3 而导致此项操作无法完成” 的归纳总结

    最近在做Asp.net项目的时候,用Ajax访问服务器数据有时候老是莫名其妙的报错:SCRIPT7002: XMLHttpRequest: 网络错误 0x2ef3, 由于出现错误 00002ef3 而 ...

  7. ajax开发框架和XMLhttpRequest、responseText、responseXml和JSON的应用

    1 AJAX开发框架 2 A 初始化XMLHttpRequest对象 3 B指定响应处理函数 4 C发出HTTP请求 5 D处理服务器返回的信息 6 数据格式提要 6 优点 6 缺点 7 解析 JSO ...

  8. 学习笔记 之--AJAX核心对象 XMLHttpRequest

    实现AJAX功能,核心就是XMLHttpRequest,而且现在大多数浏览器都支持这个核心组件对象. 实例:实现无刷新登陆验证 1.前台代码 <html xmlns="http://w ...

  9. js 发送ajax请求(XMLHttpRequest)

    <!DOCTYPE html><html> <head> <title></title> <script type="tex ...

随机推荐

  1. luoguP3175 [HAOI2015]按位或 min-max容斥 + 高维前缀和

    考虑min-max容斥 \(E[max(S)] = \sum \limits_{T \subset S} min(T)\) \(min(T)\)是可以被表示出来 即所有与\(T\)有交集的数的概率的和 ...

  2. 2018-2019-20172329 《Java软件结构与数据结构》第五周学习总结

    2018-2019-20172329 <Java软件结构与数据结构>第五周学习总结 教材学习内容总结 <Java软件结构与数据结构>第九章-排序与查找 一.查找 1.查找概念简 ...

  3. Codeforces Round #258 (Div. 2) . Sort the Array 贪心

    B. Sort the Array 题目连接: http://codeforces.com/contest/451/problem/B Description Being a programmer, ...

  4. 使用 IntraWeb (15) - 基本控件之 TIWEdit、TIWMemo、TIWText

    TIWEdit //单行文本框, 通过 PasswordPrompt 属性可以作为密码框 TIWMemo //多行文本框 TIWText //相当于多行的 TIWLabel 或不能编辑的 TIWMem ...

  5. 使用 IntraWeb (8) - 系统模板

    我们可以自定义系统错误模板, 编辑 IWError.html 放到模板文件夹后, 它将替换默认的模板. {在主页面, 这是要模拟一个系统错误} procedure TIWForm1.IWButton1 ...

  6. LPC-Link2 CMSIS-DAP firmware source

    LPC-Link2 CMSIS-DAP firmware source Hi, I'm using the CMSIS-DAP firmware with the LPC-Link2. I'd lik ...

  7. DNS服务器

    DNS服务器是指“域名解析服务器”,而域名就是我们通常所说的“网址”.在互联网中识别和寻找不同的计算机,实际上是需要知道该计算机的IP地址才能进行访问.比如220.181.38.4,这个IP就是百度的 ...

  8. AngularJS中实现显示或隐藏动画效果的3种方式

    本篇体验在AngularJS中实现在"显示/隐藏"这2种状态切换间添加动画效果. 通过CSS方式实现显示/隐藏动画效果 思路: →npm install angular-anima ...

  9. lodash用法系列(3),使用函数

    Lodash用来操作对象和集合,比Underscore拥有更多的功能和更好的性能. 官网:https://lodash.com/引用:<script src="//cdnjs.clou ...

  10. 对一个前端使用AngularJS后端使用ASP.NET Web API项目的理解(3)

    chsakell分享了一个前端使用AngularJS,后端使用ASP.NET Web API的项目. 源码: https://github.com/chsakell/spa-webapi-angula ...