创建ajax过程

约定不等于承诺〃 2022-06-08 02:05 188阅读 0赞

**(1) 创建XMLHttpRequest对象，也就是创建一个异步调用对象；**

var xmlhttp;
    if (window.XMLHttpRequest){
    	//  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
    	xmlhttp=new XMLHttpRequest();
    }
    else{
    	// IE6, IE5 浏览器执行代码
    	xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }

**(2) 创建一个新的HTTP请求，并指定该HTTP请求的方法、URL及验证信息；**

xmlhttp.open("GET","ajax_info.txt",true);

**(3) 设置响应HTTP请求状态变化的函数；**

xmlhttp.onreadystatechange=function(){
    	if (xmlhttp.readyState==4 && xmlhttp.status==200){//状态码
    		document.getElementById("myDiv").innerHTML=xmlhttp.responseText;//回调函数
    	}
    }

**(4) 发送HTTP请求；**

xmlhttp.send();

**(5) 获取异步调用返回的数据；**

xmlhttp.responseText

**(6) 使用JavaScript和DOM实现局部刷新。**

完整的实例如下：

<!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <script>
    function loadXMLDoc()
    {
    	var xmlhttp;
    	if (window.XMLHttpRequest)
    	{
    		//  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
    		xmlhttp=new XMLHttpRequest();
    	}
    	else
    	{
    		// IE6, IE5 浏览器执行代码
    		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    	}
    	xmlhttp.onreadystatechange=function()
    	{
    		if (xmlhttp.readyState==4 && xmlhttp.status==200)
    		{
    			document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    		}
    	}
    	xmlhttp.open("GET","ajax_info.txt",true);
    	xmlhttp.send();
    }
    </script>
    </head>
    <body>
    
    <div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div>
    <button type="button" οnclick="loadXMLDoc()">修改内容</button>
    
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，188人围观）

还没有评论，来说两句吧...

相关阅读

相关 Ajax是什么？Ajax有什么作用？Ajax过程，Ajax优缺点

Ajax是什么 Ajax 的全称是asynchronous javascript and xml 从全称不难发现AJAX = 异步，JavaScript 和 XML。

逃离我推掉我的手/ 2023年06月25日 11:30/ 0 赞/ 232 阅读

相关原生Ajax的创建过程

1. 创建xhr 核心对象 var xhr=new XMLHttpRequest(); 1. 调用open 准备发送参数一：请求方式参数二:

淡淡的烟草味﹌/ 2023年03月13日 05:08/ 0 赞/ 30 阅读

相关 Ajax 是什么?以及如何创建 Ajax?（marksheng）

1、Ajax 并不算是一种新的技术，全称是 asychronous javascript and xml，可以说是已有技术的组合，主要用来实现客户端与服务器端的异步通信效

向右看齐/ 2023年01月02日 09:30/ 0 赞/ 262 阅读

相关原生Ajax的创建过程 == jsonp原理

原生Ajax的创建过程 1、创建xhr 核心对象 var xhr=new XMLHttpRequest(); 2、调用open 准备发送参

阳光穿透心脏的1/2处/ 2022年12月27日 08:55/ 0 赞/ 119 阅读

相关 AJAX - 创建 XMLHttpRequest 对象

创建 XMLHttpRequest 对象所有现代浏览器（IE7+、Firefox、Chrome、Safari 以及 Opera）均内建 XMLHttpRequest 对

╰半夏微凉°/ 2022年12月07日 04:26/ 0 赞/ 223 阅读

相关 ajax的过程

AJAX=Asynchronous JavaScript and XML（异步的JavaScript和XML） AJAX不是一种新的语言，而是一种使用现有标准的新方法。

小灰灰/ 2022年09月25日 00:27/ 0 赞/ 182 阅读

相关 AJAX：创建 XMLHttpRequest 对象

AJAX = 异步 JavaScript 和 XML。 AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这

谁借莪１个温暖的怀抱￠/ 2022年09月02日 13:49/ 0 赞/ 212 阅读

相关 ajax过程

(1)创建XMLHttpRequest对象,也就是创建一个异步调用对象. (2)创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息

我会带着你远行/ 2022年07月15日 09:40/ 0 赞/ 155 阅读

相关创建ajax过程

(1) 创建XMLHttpRequest对象，也就是创建一个异步调用对象； var xmlhttp; if (window.XMLHttpRequest){

约定不等于承诺〃/ 2022年06月08日 02:05/ 0 赞/ 189 阅读

相关 Ajax 创建请求

根据不同浏览器来创建 IE浏览器是使用ActiveXObject来创建的其他浏览器则是用XMLHttpRequest来创建的鉴于该情况我们采用

朱雀/ 2022年04月17日 04:18/ 0 赞/ 148 阅读