AJAX开发步骤

步一:创建AJAX异步对象,例如:createAJAX()

步二:准备发送异步请求,例如:ajax.open(method,url)

步三:如果是POST请求的话,一定要设置AJAX请求头,例如:ajax.setRequestHeader()

如果是GET请求的话,无需设置设置AJAX请求头

步四:真正发送请求体中的数据到服务器,例如:ajax.send()

步五:AJAX不断的监听服务端响应的状态变化,例如:ajax.onreadystatechange,后面写一个无名处理函数

步六:在无名处理函数中,获取AJAX的数据后,按照DOM规则,用JS语言来操作Web页面

一:知道ajax实现步骤

  创建对象 --准备发送--发送请求--监听服务

二:注意细节

  创建对象的时候分浏览器

    ie之前版本var ajax = new ActiveXObject("microsoft.xmlhttp")

    火狐 浏览器 var ajax = new XMLHttpRequest();

  准备发送的时候有两个参数method(get,post)和url(相当于form中的action)

  发送方法名为send若为get方式写入null(因为get方式提交在请求行中请求体为null)

  监听服务端响应的状态需要判断因为不知道是错误信息还是正确的信息

    ajax.onreadystatechange = function(){

      if(ajax.readystate==4){//监听状态码为4

        if(ajax.status==200){

          //获取正确的信息

         var str = ajax.responseText;//获取响应后的html数据(可在servlet中设置response.setContextType("text/html;charset=utf-8")

         document.getElementById("id名").innerHTML=str;//初始化

        }

      }

    }

ie浏览器解析的时候地址栏不会变化发送不到servlet中所以要在地址后面加入可变且不唯一的数(new Date().getTime()获取当前的毫秒数)

onreadystatechange状态变化有几种

ajax第一天总结的更多相关文章

  1. day72 Ajax 第一天

    第一个示例:(i1+i2 ) 前端数据 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  2. [妙味Ajax]第一课:原理和封装

    知识点总结: ajax是异步的javascrip和xml,用异步的形式去操作xml 访问的是服务端,即https://127.0.0.1/ 或者 https://localhost 1.创建一个aja ...

  3. Ajax第一天——入门与基本概念

    什么是Ajax Ajax被认为是(Asynchronous JavaScript and XML的缩写).异步的js和xml 异步和同步:同步->类似打电话,接完一个再接下一个:异步:-> ...

  4. ajax 第一个程序

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  5. Ajax第一课

    <script language="javascript"></script> Javascript 函数创建     function 函数名(){    ...

  6. springmvc+ajax——第一讲(搭建)

    下面是整个整合测试的代码: ajax01.html TestController web.xml springmvc.xml applicationContext.xml <!DOCTYPE h ...

  7. 【JavaScript】--ajax

    1 什么是AJAX AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步Javascript和XML”.即使用Javascript语言与服务器进行异步交互,传 ...

  8. 四步完成ajax的使用

    什么是ajax? ajax(异步javascript xml) 能够刷新局部网页数据而不是重新加载整个网页. 如何使用ajax? 第一步,创建xmlhttprequest对象,var xmlhttp ...

  9. ajax 基础教程

    这是一本什么书?这是一本技术类的书籍,主要从历史.XMLHttpRequest对象.怎么样于服务器交互.构建完备的Ajax开发工具箱.使用jsUnit测试javascript 代码,总之就是让我们从这 ...

随机推荐

  1. HILLSTONE sg6000 g5150 怎么恢复出厂设置

    hillstone恢复出厂设置的方法(忘记密码的情况) 口令丢失情况下的处理 如果口令丢失,用户无法登录安全路由器进行配置,请在安全路由器刚启动时按住 CLR 按键大约 5 秒,使设备恢复到出厂配置. ...

  2. 【真·干货】MySQL 索引及优化实战

    热烈推荐:超多IT资源,尽在798资源网 声明:本文为转载文章,为防止丢失所以做此备份. 本文来自公众号:GitChat精品课 原文地址:https://mp.weixin.qq.com/s/6V7h ...

  3. 数据库之JDBC入门

    数据表: 代码实现(注:jar包用的8.0版本) import java.sql.*; import java.util.Scanner; public class MyDatabase { publ ...

  4. [NOI 2002] 银河英雄传说 (带权并查集)

    题目描述 公元五八○一年,地球居民迁至金牛座α第二行星,在那里发表银河联邦创立宣言,同年改元为宇宙历元年,并开始向银河系深处拓展. 宇宙历七九九年,银河系的两大军事集团在巴米利恩星域爆发战争.泰山压顶 ...

  5. @Autowired @Resource @Inject 自动注入

    一.@AutoWired ( spring 的注解 )自动注入 /** * @Autowired: * 默认按照 Student 类型去容器中找对应的组件:applicationContext.get ...

  6. Google NewSQL之Spanner

    谷歌分布式三宝 BigTable.GFS.MapReduce这传说中的谷歌分布式三驾马车,虽然谷歌没有公开具体实现代码,但却公布了相应论文,对分布式文件系统.大数据挖掘和NoSQL流行起了重大促进作用 ...

  7. BLOB的读写操作

    //BLOB写入操作package zxt.xsfw.action.ceshi; import javax.servlet.http.HttpServletRequest; import javax. ...

  8. poj1035Spell checker

    暴力解决. 先把字典里的每一个单词的长度存起来.在查找的时候.就比較长度,在多一个少一个之间找, #include<stdio.h> #include<string.h> #i ...

  9. PDF转EPUB格式电子书经验总结

    依据本人将PDF转换为EPUB电子书的经验,总结整理了这篇文章.因本人水平有限,难免有错误和不足之处,望大家及时批评指正.   写这篇文章时,假定读者已经会使用文中所列出软件的基本操作,比方如何用No ...

  10. Mac OS下PHP开发环境的搭建——基于XAMPP和IntelliJ IDEA

    简单记录一下在MacOS下,搭建PHP的开发环境吧.其实,从本质上来说,Mac对于PHP的支持还是很好的,默认带了PHP和Apache,但是由于前期对系统本身不熟悉,所以还是略微走了一些弯路--也就是 ...