ajax第一天总结
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第一天总结的更多相关文章
- day72 Ajax 第一天
第一个示例:(i1+i2 ) 前端数据 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...
- [妙味Ajax]第一课:原理和封装
知识点总结: ajax是异步的javascrip和xml,用异步的形式去操作xml 访问的是服务端,即https://127.0.0.1/ 或者 https://localhost 1.创建一个aja ...
- Ajax第一天——入门与基本概念
什么是Ajax Ajax被认为是(Asynchronous JavaScript and XML的缩写).异步的js和xml 异步和同步:同步->类似打电话,接完一个再接下一个:异步:-> ...
- ajax 第一个程序
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- Ajax第一课
<script language="javascript"></script> Javascript 函数创建 function 函数名(){ ...
- springmvc+ajax——第一讲(搭建)
下面是整个整合测试的代码: ajax01.html TestController web.xml springmvc.xml applicationContext.xml <!DOCTYPE h ...
- 【JavaScript】--ajax
1 什么是AJAX AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步Javascript和XML”.即使用Javascript语言与服务器进行异步交互,传 ...
- 四步完成ajax的使用
什么是ajax? ajax(异步javascript xml) 能够刷新局部网页数据而不是重新加载整个网页. 如何使用ajax? 第一步,创建xmlhttprequest对象,var xmlhttp ...
- ajax 基础教程
这是一本什么书?这是一本技术类的书籍,主要从历史.XMLHttpRequest对象.怎么样于服务器交互.构建完备的Ajax开发工具箱.使用jsUnit测试javascript 代码,总之就是让我们从这 ...
随机推荐
- re模块findall函数用法
title: Python subtitle: 1.re模块findall函数用法 date: 2018-12-13 10:17:28 --- Python re 模块 findall 函数用法简述 ...
- NP是什么意思?
举例叙述(转自百度百科,纯为学习笔记) 编辑 在一个周六的晚上,你参加了一个盛大的晚会.由于感到局促不安,你想知道这一大厅中是否有你已经认识的人.你的主人向你提议说,你一定认识那位正在甜点盘附近角落的 ...
- 算法46----移除K位数字
一.题目:移除K位数字 给定一个以字符串表示的非负整数 num,移除这个数中的 k 位数字,使得剩下的数字最小. 注意: num 的长度小于 10002 且 ≥ k. num 不会包含任何前导零. 示 ...
- [HEOI2013]Eden 的新背包问题
数据极水,不加优化的多重背包都能过...早知道考试的时候不加奇奇怪怪的卡常优化,卡了45分... 就是从前往后做一个多重背包,从后往前再做一个,问的时候就暴力求一下跳过这个的最佳方案... #incl ...
- OSI层次介绍
1.应用层:为应用软件提供接口,使应用程序能够使用网络服务. 2.表示层:①数据的解码和编码,②数据的加密和解密,③数据的压缩和解压缩. 3.会话层:建立.维护.管理应用程序之间的会话. 功能:对话控 ...
- 2019年北航OO第四单元(UML任务)及学期总结
第四单元两次作业总结 第十三次作业 需求分析 本次作业需要完成一个UML类图解析器,所需要解析的只有符合UML标准和能够在Java 8中复现的UML类图.查询指令存在两种:仅与所查对象有关的指令,以及 ...
- 【codeforces 805A】Fake NP
[题目链接]:http://codeforces.com/contest/805/problem/A [题意] 问你在l..r这个区间内的所有数字: 对于每个数的因子; 出现次数最多的是哪一个; [题 ...
- BA-siemens-insight_lenum点
lenum点特性 lenum点有如下特点 如果状态字是自定义的,只能在bacnet / ip的aln层使用 如果想在ms/tp层使用lenum的功能,就必须将system profile中bacnet ...
- Yii学习笔记之中的一个(安装与基础环境的配置)
0. 下载yii http://www.yiiframework.com/download/ 1. 訪问 basic 基础文件夹下的 web 文件夹 出现图1 的错误 : Invalid Con ...
- c11---位运算相关
// // main.c // 03-原码反码补码 #include <stdio.h> int main(int argc, const char * argv[]) { // int占 ...