原生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(‘请求已发送,请等待响应...‘);
时间: 2024-10-13 03:38:00

原生javaScript完成Ajax请求的相关文章

使用原生JavaScript发送ajax请求

关于使用原生JavaScript发送异步请求给服务端. 准备工作: 代码编写工具用的是sublime 服务端使用的是wamp搭的一个本地Apache服务器,主要用来返回数据 方便测试 步骤: 浏览器端 html标签绑定事件发送ajax请求----> 五步操作:1 创建异步对象XMLHttpRequest; 2 设置method url 3 发送请求给服务端 4 注册事件   5 在事件中获取服务端返回的数据,进行操作. 服务器端 1 获取请求数据 2 返回结果给浏览器 下面来一个小demo1做一

原生javascript发送ajax请求及服务端处理

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><h

原生JavaScript 封装ajax

原生JavaScript 封装ajax   function myajax(options){ //新建一个局部对象 用来存放用户输入的各种参数 var opt={ type:options.type||"get",//获取用户输入的传输方法,可选,不写为get data:options.data||"",//获取用户输入的数据 dataType:options.dataType||"",//获取用户输入的数据类型比如json 或者xml url

原生 JavaScript 实现 AJAX、JSONP

相信大多数前端开发者在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的. 其实,原生JavaScript实现AJAX并不难,这篇文章将会讲解如何实现简单的AJAX,还有跨域请求JSONP! 一.AJAX AJAX的核心是XMLHttpRequest. 一个完整的AJAX请求一般包括以下步骤: 实例化XMLHttpRequest对象 连接服务器 发送请求 接收响应数据

javascript中Ajax请求的封装代码

/****************************ajax请求 start**************************************/ function ajaxClass(_url, _successCallback, _failureCallback, _urlParameters, _callbackParams, _async, _charset, _timeout, _frequency, _requestTimes, _frame) { /** * AJAX

javascript版Ajax请求

什么是Ajax请求,Ajax也就是"Asynchronous JavaScript and XML"(异步JavaScript和XML),无刷新数据读取.能减少流量的消耗,也提高了浏览的流畅性,给用户更加友好的体验. 发送Ajax请求也就几步便可完成 第一步:创建异步对象 var xhr = new XMLHttpRequest(); 这样创建的异步对象是给新版的浏览器用的,当然不乏一些用着旧版浏览器的老客户.旧版的创建方法如下: var xhr = new ActiveXObject

原生JS发送Ajax请求

注意了,划重点了,这一题考不到算我输! 一.JS原生Ajax Ajax=异步Javascript+XML: ajax是一种数据请求的方式,不需要刷新整个页面.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. ajax的核心技术当然是XMLHttpRequest对象: ajax请求过程:创建XMLHttpRequest对象.连接服务器.发送请求.接受相应数据. 废话少说上代码! p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0p

原生javascript实现Ajax和jQuery实现Ajax实例应用

这是我自己写的例子,希望对大家有帮助 使用了struts2,jdk1.6 1.实体类书写 public class Student { private String toid ; private String name ; private String sex ; public String getToid() { return toid ; } public void setToid(String toid) { this.toid = toid; } public String getNam

原生js实现Ajax请求

总的来说,Ajax是与服务器交换数据并更新部分网页的艺术,在不重新加载整个网页的情况下,异步请求数据并刷新页面.举一个小的例子:Goole搜索页面.当用户在输入框输入关键字的时候,JavaScript会把这些字符发送到服务器,然后服务器返回一个搜索建议的列表. 原生的Ajax 原生的Ajax请求离不开XHR对象,即XMLHttpRequest对象.所有现代浏览器都内建有这个对象. 创建整个对象: var xhr = new XMLHttpRequest(); 这里有个版本的差异,IE5和IE6使