方法一:

function createXMLHTTPRequest() {
//1.创建XMLHttpRequest对象
//这是XMLHttpReuquest对象无部使用中最复杂的一步
//需要针对IE和其他类型的浏览器建立这个对象的不同方式写不同的代码
var xmlHttpRequest;
if (window.XMLHttpRequest) {
//针对FireFox,Mozillar,Opera,Safari,IE7,IE8
xmlHttpRequest = new XMLHttpRequest();
//针对某些特定版本的mozillar浏览器的BUG进行修正
if (xmlHttpRequest.overrideMimeType) {
xmlHttpRequest.overrideMimeType("text/xml");
}
} else if (window.ActiveXObject) {
//针对IE6,IE5.5,IE5
//两个可以用于创建XMLHTTPRequest对象的控件名称,保存在一个js的数组中
//排在前面的版本较新
var activexName = ["MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];
for (var i = ; i < activexName.length; i++) {
try {
//取出一个控件名进行创建,如果创建成功就终止循环
//如果创建失败,回抛出异常,然后可以继续循环,继续尝试创建
xmlHttpRequest = new ActiveXObject(activexName[i]);
if (xmlHttpRequest) {
break;
}
} catch (e) {
}
}
}
return xmlHttpRequest;
} //post方法
function post() {
//创建AJAX原生环境后用变量接收
var req = createXMLHTTPRequest();
if (req) {
//传参方式,url,是否异步(asyn)
req.open("POST", "webAjax.ashx", true);
//post必须设置这个类型
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
//必须带这个传参,就算你要调用的方法不带参数,不管是get还是post有参传参,没参传空
req.send("");
//回调函数,当 readyState 等于 4 且状态为 200 时,表示响应已就绪,可以做数据操作了
req.onreadystatechange = function () {
if (req.readyState == ) {
if (req.status == ) {
//req.responseText可以返回后台的返回内容
alert("success");
} else {
alert("error");
}
} }
}
} //get方法
function get() {
var req = createXMLHTTPRequest();
if (req) {
req.open("GET", "AJAXTest.aspx", true);
req.onreadystatechange = function () {
if (req.readyState == ) {
if (req.status == ) {
alert(req.responseText);
} else {
alert("error");
}
}
}
req.send(null);
}
}

方法二:

 //以get方法为例
var xmlhttp;
function loadXMLDoc(url, cfunc) {
//创建环境
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//创建回调函数
xmlhttp.onreadystatechange = cfunc;
//get方式发送数据
xmlhttp.open("GET", url, true);
xmlhttp.send();
}
function myFunction() {
//调用上述的AJAX方法,传入url和回调函数的实现方法(响应就绪时会执行)
loadXMLDoc("/ajax/test1.txt", function () {
if (xmlhttp.readyState == && xmlhttp.status == ) {
document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
}
});
}

原生的AJAX写法,可以直接复制过来套用的更多相关文章

  1. screen,client,page三种确定鼠标坐标的区别和原生JS事件写法,区别于Jquery的$.on(x,y);和$.click()

    screenX clientX pageX的区别 screenX:鼠标位置相对于用户屏幕水平偏移量,而screenY也就是垂直方向的,此时的参照点也就是原点是屏幕的左上角. clientX:跟scre ...

  2. 使用XMLHttpRequest对象完成原生的AJAX请求

    1.大家眼中的Ajax 说到Ajax,只要有过前端开发经验的童鞋一定都不陌生,大都知道它就是一种与后端之间的通信技术,通过这个神奇的家伙,我们不用像传统表单那样填完信息一点提交就呼啦呼啦跳转了.Aja ...

  3. 原生js ajax与jquery ajax的区别

    原生js ajax的调用: ajax({ type : "get", url : "02_ajax_get.txt", data : { "userN ...

  4. js原生的Ajax

    js原生的Ajax其实就是围绕浏览器内内置的Ajax引擎对象进行学习的,要使用js原 生的Ajax完成异步操作,有如下几个步骤: 1)创建Ajax引擎对象 2)为Ajax引擎对象绑定监听(监听服务器已 ...

  5. 原生Ajax写法(GET)

    ajax的GET提交方式的原生代码: var xhr = null; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else if(w ...

  6. 原生ajax写法

    ajax1.0,ie9及以下,ie10+支持ajax2.0 ajax2.0比ajax1.0: 1.多了FormData对象,xhr.send(formData)  //不能用GET 2.文件上传,文件 ...

  7. JS 原生ajax写法

    <script> //step1.创建XMLHTTPRequest对象,对于低版本的IE,需要换一个ActiveXObject对象 var xhr; if (window.XMLHttpR ...

  8. 原生实现ajax解析--XMLHttpRequest

    ajax基础: Asynchronous JavaScript and XML,意思就是用JavaScript执行异步网络请求. 如果仔细观察一个Form的提交,你就会发现,一旦用户点击“Submit ...

  9. 原生javascript Ajax

    代码 1. IE5 ,IE6 使用ActiveXObject对象,   其余现代浏览器都支持XMLHttpRequest对象: function ajaxObject(){ var xmlhttp; ...

随机推荐

  1. 51nod1119 机器人走方格 V2

    终于学到了求组合数的正确姿势 //C(n+m-2,m-1) #include<cstdio> #include<cstring> #include<cctype> ...

  2. python练习程序(c100经典例17)

    题目: 输入一行字符,分别统计出其中英文字母.空格.数字和其它字符的个数. def foo(a): l=len(a); letters=0; space=0; digit=0; others=0; f ...

  3. 文件IO

    在unix世界中视一切为文件,无论最基本的文本文件还是网络设备或是u盘,在内核看来它们的本质都是一样的.大多数文件IO操作只需要用到5个函数:open . read . write . lseek 以 ...

  4. 【解题报告】POJ-1467 Symbolic Derivation

    原题地址:http://poj.org/problem?id=1467 题目大意: 对一个式子求导,给的式子包括常量,字母x,+,-,*,/,ln()运算符,任意嵌套的括号.求的导数式子不用化简,如1 ...

  5. php 二维数组的排序

    写这是之前一直二维数组排名困扰.自己写的好复杂. 正题: array_mutisort 官方帮助文档 <?php// 取得列的列表foreach ($data as $key => $ro ...

  6. Oracle buffer cache与相关的latch等待事件

    buffer cache与相关的latch等待事件 1.buffer cache 2.latch:cache buffers lru chain 3.latch:cache buffers chain ...

  7. adb shell 查找并删除文件

    # -*- coding: cp936 -*- ## function: remove file ## remark: python version -- import os,sys import l ...

  8. Python使用os.listdir()函数来得目录内容的介绍

    Python编程语言是计算机语言中常用的语言,以下的文章就是介绍在Python编程语言中使用os.listdir()函数来获得目录中的相关内容的介绍,如果你对其相关的实际操作有兴趣的话,你就可以观看以 ...

  9. MYSQL中 ENUM、SET 类型(建议用tinyint代替)

    ENUM类型 ENUM 是一个字符串对象,其值通常选自一个允许值列表中,该列表在表创建时的列规格说明中被明确地列举. 在下列某些情况下,值也可以是空串("") 或 NULL: 如果 ...

  10. JQuery实现分页程序代码,源码下载

    Web开发,分页在所难免的,微软GridView.AspPager等设置分页数据可以自动分页,但是这里浏览器会闪动,用户体验不是很友好,在此我整理了JQuery实现分页,并且使用 JQuery模板显示 ...