`
小笨熊
  • 浏览: 63463 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

Ajax学习小结

阅读更多

原理:

          就是通过触发JavaScript事件,调用服务器程序(可以是Servlet,也可以是Action),得到所需要的值。这个值再通过载  体,返回给JavaScript,从而返回给界面,实现局部刷新!而中间的这个载体就是ActiveXObject("MSXML2.XMLHTTP");

核心流程:
 1、HTML 中执行 JavaScript
 2、JavaScript 中去实例化 xmlHttp
 3、xmlHttp 去发出请求调用后台 Servlet
 4、Servlet 返回响应给 xmlHttp
 5、xmlHttp 拿着响应信息去更新 HTML

核心代码:

<script><!---->
  var xmlHttp=new ActiveXObject("MSXML2.XMLHTTP");//只是IE的;

  function sendRequest(){
   //open方法用来设置请求发送,有三个参数(1、请求方式;2、请求地址;3、为true时用异步方式发送);
   xmlHttp.open('get','http://localhost:8080/WebModule1/ajaxservlet?name='+f.uname.value,true);
   //onreadystatechange方法设置谁来接收;
   xmlHttp.onreadystatechange=getResponse;
   //send请求真正的发出;
   xmlHttp.send(null);
  }

  function getResponse(){
   //readyState判断响应的4种状态(4为响应结束);
   if(xmlHttp.readyState==4){
    //status=200表示页面响应是正确的;400,404,500
    if(xmlHttp.status==200){
     ds.innerHTML=xmlHttp.responseText;
    }
   }
  }

</script>
 

终上所述:

          现在已经可以实现一个Ajax程序了(只用上面这两个方法就可以了)。只需在界面调用sendRequest()方法。

分享到:
评论

相关推荐

    AJAX学习总结(一)--基于jQuery第一个实例

    在本篇“AJAX学习总结(一)--基于jQuery第一个实例”中,我们将探讨如何使用jQuery库实现异步JavaScript和XML(AJAX)技术。AJAX允许我们在不刷新整个页面的情况下,更新网页的部分内容,从而提供更流畅的用户体验...

    Asp.net+Ajax学习总结.xls

    Asp.net+Ajax学习总结.xls,Asp.net+Ajax学习总结.xls

    AJAX学习总结(四)---解决缓存问题

    在“AJAX学习总结(四)---解决缓存问题”这篇博文中,作者LC2586详细讲解了这些方法,并可能通过实例展示了如何在代码中应用它们。通过阅读和实践,你可以更深入地掌握AJAX缓存管理技巧,提升你的Web应用质量。

    AJAX学习总结(六)---可收缩展开的级联菜单和局部刷新

    在本篇“AJAX学习总结(六)---可收缩展开的级联菜单和局部刷新”中,我们将深入探讨如何利用AJAX技术实现交互性更强的Web应用,特别是针对级联菜单和页面局部刷新这两个功能。AJAX(Asynchronous JavaScript and ...

    AJAX学习总结(七)---实现可编辑的表格

    在本篇“AJAX学习总结(七)---实现可编辑的表格”中,我们将探讨如何利用AJAX技术来创建一个动态、交互式的表格,让用户能够直接在页面上编辑数据,无需刷新整个页面。AJAX(Asynchronous JavaScript and XML)是一...

    AJAX学习总结(五)---窗口的淡入淡出和css学习

    在本篇博客"AJAX学习总结(五)---窗口的淡入淡出和css学习"中,作者主要探讨了如何利用AJAX技术实现网页元素的动态更新,以及结合jQuery库来实现窗口的淡入淡出效果。同时,还涉及了一些CSS的基础知识。以下是关于...

    Ajax学习总结

    ### Ajax学习总结 #### 一、Ajax概述 Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步...

    AJAX学习总结(三)--jQuery处理xml数据

    在本篇博客"AJAX学习总结(三)--jQuery处理xml数据"中,我们将深入探讨如何使用jQuery库来处理XML格式的数据。XML(eXtensible Markup Language)是一种用于存储和传输数据的标准格式,尤其在Web应用程序中广泛使用...

    AJAX学习总结(八)---Jquery实例:动态股票价格

    在本篇“AJAX学习总结(八)---Jquery实例:动态股票价格”中,我们将深入探讨如何使用jQuery库来实现AJAX技术,以便实时更新网页上的股票价格信息。AJAX,即异步JavaScript和XML,是一种在无需刷新整个页面的情况下...

    AJAX学习总结(二)--XMLHttprequest实例

    **AJAX学习总结(二)--XMLHttpRequest实例** 在Web开发中,AJAX(Asynchronous JavaScript and XML)技术被广泛用于实现页面的无刷新更新,提高用户体验。本篇将聚焦于XMLHttpRequest对象,它是AJAX的核心,负责在...

    AJAX学习总结(九)---Jquery实例:仿googlesuggest自动补全功能

    在本篇博客“AJAX学习总结(九)---Jquery实例:仿googlesuggest自动补全功能”中,作者分享了如何使用jQuery实现一个类似Google Suggest的自动补全功能,这是一种常见的前端交互设计,广泛应用于搜索框输入时提供...

    Ajax学习笔记个人总结

    ### Ajax学习笔记个人总结 #### 一、XMLHttpRequest对象简介 **XMLHttpRequest** 对象是 AJAX 技术的核心,它负责在客户端与服务器之间发送异步请求,无需刷新整个页面即可实现局部数据更新。要使用 ...

    Ajax学习——DWR的参考书和实用案例学习总结

    **Ajax学习——DWR的参考书和实用案例学习总结** DWR(Direct Web Remoting)是一种优秀的开源框架,专门用于简化Web应用程序中的Ajax(Asynchronous JavaScript and XML)开发。Ajax技术允许网页在不刷新整个页面...

    Ajax全套学习教程

    总结,Ajax是Web开发中不可或缺的一部分,它提高了网页的交互性和用户体验。通过深入学习Ajax,开发者能更好地构建动态、高效的Web应用程序。本套教程将覆盖以上所有知识点,并通过实例教学,确保学习者能够熟练运用...

    AJAX技术学习总结分享.pdf

    AJAX技术学习总结分享.pdf 一、Ajax技术原理总结 Ajax技术是一种创建交互式网页应用的网页开发技术,也是一种用于创建快速动态网页的技术。它通过在后台与服务器进行少量数据交换,AJAX可以使网页实现异步更新。...

    ajax学习很好的学习文档

    总结来说,`web.xml`配置文件与Ajax技术虽然看似不直接相关,但它们都是构建动态Web应用的关键组件。前者定义了服务器端的逻辑和行为,后者则优化了用户体验,实现了无需刷新页面即可更新内容的能力。理解并掌握这...

    ajax学习资料总结

    【Ajax学习资料总结】 Ajax,即异步JavaScript和XML,是一种在2005年由Google推广的编程模式,用于创建更高效、响应更快的Web应用程序。它不是一种新的编程语言,而是利用现有Web标准(如JavaScript和XML)的新技术...

    学习ajax的文档——ajax基础文档

    总结,Ajax通过JavaScript实现了网页的局部刷新,提升了用户体验,减少了网络通信的开销。理解并掌握Ajax的基本用法和高级特性,对于开发动态、交互性强的Web应用至关重要。通过不断实践和深入学习,你将能够运用...

Global site tag (gtag.js) - Google Analytics