原生javaScript完成Ajax请求
使用原生javaScript完成Ajax请求,首先应该创建一个对象XMLHttprequest,考虑到兼容低版本IE浏览器,使用ActiveXObject对象,代码入下:
var request;
if(windoe.XMLHtprequest){
request=new XMLHttprequest();
}else{
request = new ActiveXObject();
}
function success(text) {
var textarea = document.getElementById('test-ie-response-text');
textarea.value = text;
} function fail(code) {
var textarea = document.getElementById('test-ie-response-text');
textarea.value = 'Error code: ' + code;
} var request = new ActiveXObject('Microsoft.XMLHTTP'); // 新建Microsoft.XMLHTTP对象 request.onreadystatechange = function () { // 状态发生变化时,函数被回调
if (request.readyState === 4) { // 成功完成
// 判断响应结果:
if (request.status === 200) {
// 成功,通过responseText拿到响应的文本:
return success(request.responseText);
} else {
// 失败,根据响应码判断失败原因:
return fail(request.status);
}
} else {
// HTTP请求还在继续...
}
} // 发送请求:
request.open('GET', '/api/categories');
request.send(); alert('请求已发送,请等待响应...');
原生javaScript完成Ajax请求的更多相关文章
- 原生 JavaScript 实现 AJAX、JSONP
相信大多数前端开发者在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的 ...
- 原生JavaScript写AJAX
前端JavaScript: function ajaxGet(url, obj) { var request; if(window.XMLHttpRequest) { request = new XM ...
- 原生JavaScript 封装ajax
原生JavaScript 封装ajax function myajax(options){ //新建一个局部对象 用来存放用户输入的各种参数 var opt={ type:options.type ...
- 原生JavaScript实现AJAX、JSONP
相信大多数前端开发者在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的 ...
- 原生js实现Ajax请求
总的来说,Ajax是与服务器交换数据并更新部分网页的艺术,在不重新加载整个网页的情况下,异步请求数据并刷新页面.举一个小的例子:Goole搜索页面.当用户在输入框输入关键字的时候,JavaScript ...
- 原生JS发送Ajax请求、JSONP
一.JS原生Ajax Ajax=异步Javascript+XML: ajax是一种数据请求的方式,不需要刷新整个页面.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. ajax的核心 ...
- 原生js发送ajax请求
堕落了一阵子了,今天打开博客,发现连登录的用户名和密码都不记得了.2016年已过半,不能再这么晃荡下去了. 参加了网易微专业-前端攻城狮 培训,目前进行到大作业开发阶段,感觉举步维艰.但是无论如何,不 ...
- 转贴:JavaScript实现Ajax请求简单示例
转至:https://my.oschina.net/u/658145/blog/167651 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 ...
- javascript版Ajax请求
什么是Ajax请求,Ajax也就是“Asynchronous JavaScript and XML”(异步JavaScript和XML),无刷新数据读取.能减少流量的消耗,也提高了浏览的流畅性,给用户 ...
随机推荐
- nyoj 38 简单并查集的应用&最小生成树
#include<stdio.h> #include<stdlib.h> #define inf 0x3fffffff #define N 600 struct node { ...
- hdu 2491 贪心
#include<stdio.h> #include<stdlib.h> #define N 110000 struct node { int u,v,len,time; }m ...
- yii2.0 表单小部件常用的默认选中
下面自己总结了一下表单小部件中经常使用到的一些默认选中 直接在视图代码里面说明啦 <?php //这个表头就不多说了 use yii\helpers\Html; use yii\widgets\ ...
- 图像算法研究---Adaboost算法具体解释
本篇文章先介绍了提升放法和AdaBoost算法.已经了解的可以直接跳过.后面给出了AdaBoost算法的两个样例.附有详细计算过程. 1.提升方法(来源于统计学习方法) 提升方法是一种经常使用的统计学 ...
- ACM/OI 出题用
之前出题,很苦恼出数据和检查程序,因为很多繁琐的工作,还很可能小手一抖出问题. 最近又在出题...想起之前的对拍脚本,感觉不能更方便,于是撸了一套出题用的小工具,也学习了一点点的DOS命令 首先是输入 ...
- 29.QT主窗口加widget
运行效果 widget布局showwidget.h #ifndef SHOWWIDGET_H #define SHOWWIDGET_H #include <QWidget> #includ ...
- vue.js的学习之路
因为对jquery的ajax渲染很不满,所以我就来学vue.js了 1)vue.js是什么 官方解释为:Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型 ...
- layer Tips参数使用
layer.tips(content, follow, options) - tips层type:4的深度定制.也是我本人比较喜欢的一个层类型,因为它拥有和msg一样的低调和自觉,而且会智能定位,即灵 ...
- FluentAPI关系映射配置
都有哪几种关系? 1vs多,多vs多 1. 概念or关系映射相关方法: 1) 基本套路:this.Has***(o=>o.AAA).With***() 当前这个表和AAA属性的表关系是Has定义 ...
- 关于flex布局中的兼容性问题
这几天在做项目中用到了flex布局,但是在测试的过程中发现他的兼容性实在是太差了,仅仅用到水平和垂直居中的样式,没想到兼容性代码就写了好几行. display:flex; display:-webki ...