javascript中ajax的四大步骤
原生js中ajax写法一:
function ajaxys(){
//1、 创建xhr对象
var xhr = new XMLHttpRequest();//XMLHttpRequest()
// 2、打开浏览器的连接
xhr.open('get','112.json',true);
// 3、请求发送给服务器,对于get来说send里的参数为空或者null
xhr.send();//或者xhr.send(null)
// 4、判断服务器的状态,若准备就绪,就去获取数据
xhr.onreadystatechange = function(){
if (xhr.readyState == 4) {//证明服务器已经准备就绪
if (xhr.status == 200) {//页面请求成功
// var txt = xhr.responseText;//表示取出数据
document.getElementById('boxs').innerHTML = xhr.responseText;//表示取出数据,并把数据复制给boxs
}
}
}
}
//当点击btn按钮时触发对ajax的请求
$('#btn').click(function(){
ajaxys();//执行ajax的请求
});
原生js中写ajax的方法二:(利用回调函数callback)
//先声明一个异步请求对象
var xmlHttpReg = null;
function ajax() {
if (window.ActiveXObject) {//如果是IE
xmlHttpReg = new ActiveXObject("Microsoft.XMLHTTP");
} else if (window.XMLHttpRequest) {
xmlHttpReg = new XMLHttpRequest(); //实例化一个xmlHttpReg
}
//如果实例化成功,就调用open()方法,就开始准备向服务器发送请求
if (xmlHttpReg != null) {
xmlHttpReg.open("get", "checknumber.php?type="+gametype+"&round="+gameroundno, true);
xmlHttpReg.send();
xmlHttpReg.onreadystatechange = doResult; //设置回调函数
}
}
//设定函数doResult(),便于调用
function doResult() {
if (xmlHttpReg.readyState == 4 && xmlHttpReg.status == 200) {//4代表执行完成
document.getElementById("content").innerHTML = xmlHttpReg.responseText;
}
}
原生的js的ajax写法主要有三点:
1、创建异步请求对象 : 异步请求对象要兼顾IE和标准的浏览器
3、状态与响应 


javascript中ajax的四大步骤的更多相关文章
- javaScript中ajax、axios总结
一.原生js实现ajax请求: 步骤: get请求: // 1.创建一个XMLHttpRequest的对象. var xml=null; //初始值设为空 if(XMLHttpRequest){ xm ...
- JavaScript中Ajax的使用
AJAX全称为“Asynchronous javascript and XML”(异步javascript和XML),是指一种创建交互式网页应用的网页开发技术.通过在后台与服务器进行少量数据交换,AJ ...
- JavaScript中Ajax
Ajax技术,就是指:向服务器请求额外的数据而无须重新加载整个页面.其核心就是 XMLHttpRequest对象.(简称:XHR) 在这里,我们先讨论IE7及更高版本,以及FF,Opera,Chrom ...
- javascript中ajax post实例详解
一,原生态的XMLHttpRequest 代码如下 复制代码 <script language="javascript"> function savei ...
- JavaScript中Ajax的get和post请求
AJAX = 异步 JavaScript和XML(Asynchronous JavaScript and XML) 作用:在不重新加载整个网页的情况下,对网页的某部分进行更新. 两种请求方式: 1 ...
- JavaScript中Ajax的用法
XMLHttpRequest 对象的属性和方法: open(method,url,async) 规定请求的类型.URL 以及是否异步处理请求 send(string) 将请求发送到服务器. res ...
- javascript中Ajax的简单封装
GET方式的在线:DEMO POST方式在线:DEMO // 1.封裝AJAX函數 function nativeAjax(option,success,error){ // 定义domain,方便环 ...
- Ajax原生四大步骤
1.首先创建一个js文件夹名为common.js.创建一个createXhr()的函数.在此方法中创建异步对象XMLHttpRequest,后面使用的时候直接引入common.js文件,然后进行调用就 ...
- Javascript 中ajax实现前台向后台交互
第一种情况:前台传入字符串参数 后台返回json字符串.或是json数组 代码如下: 前台: $.ajax({ url: "xxx/xxx.action", data: &quo ...
随机推荐
- selenium捕捉视频
捕捉视频 有时候我们未必能够分析故障只需用日志文件或截图的帮助.有时捕获完整的执行视频帮助.让我们了解如何捕捉视频. 我们将利用Monte媒体库的执行相同. 配置 第1步:导航到URL - http: ...
- JetBrains 授权服务器(License Server URLS)
分享几个已经部署好的在线验证服务器:http://idea.iteblog.com/key.php http://idea.imsxm.com/ http://103.207.69.64:1017 h ...
- Java内存泄漏问题
1:java中垃圾回收机制主要完成下面两件事情: 跟踪并监控每个java对象,当某个对象处于不可达状态时,回收该对象所占的内存 清理内存分配,回收过程中产生的内存碎片 2:对于JVM的垃圾回收机制来说 ...
- js常用函数整理
类型转换:parseInt\parseFloat\toString 类型判断:typeof;eg:if(typeof(var)!="undefined")\isNaN 字符处理函数 ...
- LeetCode(41):缺失的第一个正数
Hard! 题目描述: 给定一个未排序的整数数组,找出其中没有出现的最小的正整数. 示例 1: 输入: [1,2,0] 输出: 3 示例 2: 输入: [3,4,-1,1] 输出: 2 示例 3: 输 ...
- 步步为营-42-通过DataAdapter实现增删查改
说明:通过DataAdapter或者dataset连接数据库,实现对数据增删改查操作. 以前写过一篇步步为营-23-通过GridView实现增删改 1:SqlDataAdapter DataTabl ...
- 最近关于mysql的造型,binlog使用,以及阿里云上线数据处理错误导致被处罚的思考
因团队中成员,上线代码时,不小心将数据表中吃掉物理的数据清空,导致被单位处罚,痛定思痛,我们应该如何上线,还需要准备哪些技能? 1.上线时,必须关闭服务,不能一边上线,一边让用户可以继续操作,一边产生 ...
- canvas百分百特效
这个特效是别的人,非原创.原创地址 http://blog.csdn.net/lecepin/article/details/53536445 背后的水是可以动的 代码我再研究了下,下面是加了注释的代 ...
- maven的三种工程pom、jar、war
阅读数:739 maven中的三种工程: 1.pom工程:用在父级工程或聚合工程中.用来做jar包的版本控制. 2.war工程:将会打包成war,发布在服务器上的工程.如网站或服务. 3.jar工程: ...
- Codeforces Round #395 (Div. 2)
今天自己模拟了一套题,只写出两道来,第三道时间到了过了几分钟才写出来,啊,太菜了. A. Taymyr is calling you 水题,问你在z范围内 两个序列 n,2*n,3*n...... ...