ajax请求的五个步骤java_js ajax请求的五个步骤实现详解

ajax请求的五个步骤java_js ajax请求的五个步骤实现详解Ajax是Java前端最重要的技术之一,是支撑着前端交互数据的基石,今天我们就来了解下ajax发送请求所需的五个步骤。首先我们需要来了解一下ajax,ajax的全称是AsynchronousJavascript+XML。异步传输+js+xml。所谓异步,在这里简单地解释就是:向服务器发送请求的时候,我们不必等待结果,而是可以同时做其他的事情,等到有了结果我们可以再来处理这个事。这个很重要,如果不是…

大家好,又见面了,我是你们的朋友全栈君。

Ajax是Java前端最重要的技术之一,是支撑着前端交互数据的基石,今天我们就来了解下ajax发送请求所需的五个步骤。

首先我们需要来了解一下ajax,ajax的全称是AsynchronousJavascript+XML。

异步传输+js+xml。

所谓异步,在这里简单地解释就是:向服务器发送请求的时候,我们不必等待结果,而是可以同时做其他的事情,等到有了结果我们可以再来处理这个事。

这个很重要,如果不是这样的话,我们点完按钮,页面就会死在那里,其他的数据请求不会往下走了。这样比等待刷新似乎更加讨厌。

xml只是一种数据格式,在这件事里并不重要,我们在更新一行字的时候理论上说不需要这个格式,但如果我们更新很多内容,那么格式化的数据可以使我们有条理地去实现更新。

原生js发送ajax请求的是“XMLHttpRequest”,它的请求就是ajax的五个步骤。

Ajax五个步骤如下:

1.建立XMLHttpRequest对象;

2.设置回调函数;

3.使用open方法与服务器建立链接;

4.向服务器发送数据;

5.在回调函数中针对不同的响应状态进行处理;

下面用几个例子来实现一下吧:

1.建立xmlHttpRequest对象if (window.XMLHttpRequest)

{

xmlHttp = new XMLHttpRequest();

if (xmlHttp.overrideMimeType)

{

xmlHttp.overrideMimeType(“text/xml”);

}

}

else if (window.ActiveXobject)

{

var activeName = [“MSXML2.XMLHTTP”, “Microsoft.XMLHTTP”];

for (var i = 0; i 

{

try

{

xmlHttp = new ActiveXobject(activeName[i]);

break;

}

catch (e)

{}

}

}

if (!xmlHttp)

{

alert(“创建xmlhttprequest对象失败”);

}

else

{}

2.设置回调函数xmlHttp.onreadystatechange = callback;

function callback()

{}

3.使用OPEN方法与服务器建立连接 xmlHttp.open(“get”,”ajax?name=”+ name,true)此步注意设置http的请求方式(post / get), 如果是POST方式,注意设置请求头信息xmlHttp.setRequestHeader(“Content-Type”, “application/x-www-form-urlencoded”)

4.向服务器端发送数据xmlHttp.send(null);

如果是post就不为空

5.在回调函数中针对不同的响应状态进行处理if (xmlHttp.readyState == 4)

{ //判断交互是否成功

if (xmlHttp.status == 200)

{ //获取服务器返回的数据 //获取纯文本数据

var responseText = xmlHttp.responseText;

document.getElementById(“info”)

.innerHTML = responseText;

}

}

以上就是本篇文章的所有内容了,更多ajax相关内容,请一直关注本站了解吧。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/145295.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • mysql联合索引失效

    mysql联合索引失效联合索引,能够缩小查询范围的字段放在第一个,比如表sensor_coc_repay_feature存近一个月数据两千多万条,建立联合索引(time,distinct_id),按照查询select*fromsensor_coc_repay_featurewheredistinct_id=%sandtime>‘2022-02-20’,此时然后按照联合索引最左匹配有使用到了time,distinct_id,但是经过time查询后的数据还会是全表,mysql会认为该查询还不如走全表查询

    2022年9月4日
    7
  • Java是什么?Java到底能干嘛?

    Java是什么?Java到底能干嘛?我刚开始学习Java的时候,很长一段时间都有这么个疑惑?Java到底是啥?它能干什么?自己也看过不少的课程和书,大部分都是从Java的发展史开始讲,总之就是那些什么Jav…

    2022年7月7日
    15
  • 原生HTML+CSS+JS制作自己的导航主页(前端大作业,源码+步骤详解)

    原生HTML+CSS+JS制作自己的导航主页(前端大作业,源码+步骤详解)文章目录前言插入背景一、头部1.导航栏2.优化导航栏3时间前言插入背景首先设置我们的背景。在body中插入背景即可。index.html<!doctypehtml><htmllang=”en”><head><metacharset=”UTF-8″><metaname=”Designer”content=”LiWei”><metaname=”Description”cont

    2022年7月22日
    16
  • win10开始键没反应解决方法「建议收藏」

    win10开始键没反应解决方法「建议收藏」win10开始键没反应解决方法具体方法如下:1、打开运行窗口。windows7系统:通过“开始”菜单进入。点击“开始”菜单,从打开的菜单中依次点击“所有程序”>“附件”>“运行”来打开“运行”窗口。windows10系统:右击屏幕左下角win标志,在弹出的菜单中找到“运行”,点击进入运行窗口2、在搜索窗口输入“regedit”,打开注册表编辑器。3、在在注册表“HKEY_CLASSES_ROOT”主键下找到“lnkfile”字符串值项。打开它。4、在右侧右击它,会出现一个菜单

    2022年5月4日
    43
  • 轻松搞懂【TF-IDF、word2vec、svm、cnn、textcnn、bilstm、cnn+bilstm、bilstm+attention实现】英文长文本分类[通俗易懂]

    轻松搞懂【TF-IDF、word2vec、svm、cnn、textcnn、bilstm、cnn+bilstm、bilstm+attention实现】英文长文本分类[通俗易懂]项目来源:https://www.kaggle.com/c/word2vec-nlp-tutorial/之前我写过几篇博客:就这?word2vec+BiLSTM、TextCNN、CNN+BiLSTM、BiLSTM+Attention实现中英文情感分类代码详解就这?word2vec+SVM(支持向量机)实现中英文情感分类代码详解这两篇博客主要是基于中文进行情感分类的,那么本篇博客,我会以这个kaggle项目来介绍如何实现英文长文本情感分类。1实验数据本次数据集来源于kaggle项目“Bago

    2022年6月28日
    27
  • SpringCloud(二)—-Ribbon简介

    SpringCloud(二)—-Ribbon简介

    2020年11月12日
    205

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号