JavaScript小记——Ajax异步请求

Ajax介绍

Ajax使用

ES6拼串语法

Ajax介绍

Ajax Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。

AJAX 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新

加载整个网页的情况下，对网页的某部分进行更新。

Ajax使用

1.创建对象

var xmlhttp = new XMLHttpRequest();

2.向服务器发送请求如需将请求发送到服务器，我们使用 XMLHttpRequest 对象的 open() 和

send() 方法

xmlhttp.open("GET", "https://api.oioweb.cn/api/common/teladress?mobile="+phoneNumber, true);

xmlhttp.send();

3.服务器响应

onreadystatechange 事件

每当 readyState 改变时，就会触发 onreadystatechange 事件。

xmlhttp.onreadystatechange = function () {

4.请求已完成，且响应已就绪

if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {

//获取后台返回的json字符串

var jsonString =xmlhttp.responseText;

console.log(jsonString);

//解析后台返回的JSON字符串

var jsonObj=JSON.parse(jsonString);

var text=jsonObj.result.name;

//DOM操作，把数据展示页面上

document.getElementById("title").innerText=text;

}
}

ES6拼串语法

var info2="我的名字叫做"+name+"性别"+sex+"家住"+address;

//ES6的语法
var info3=`我的名字叫做${name}性别${sex}家住${address}`;

JavaScript小记——Ajax异步请求相关推荐

php原生的异步请求,原生JavaScript实现Ajax异步请求
ajax现在是一种非常流行的技术,现在虽然可以利用JQuery或者一些第三方插件甚至微软提供的一些控件可以方面的实现ajax功能,但是明白其原理也是非常重要的,下面是来使用纯javascript实现获 ...
Ajax异步请求-简单模版
1 <script type="text/javascript"> 2 window.onload = function () { 3 document.getElem ...
Ajax(异步请求)和传统(同步请求)区别
在服务器端判断request来自Ajax请求(异步)还是传统请求(同步): 两种请求在请求的Header不同,Ajax 异步请求比传统的同步请求多了一个头参数 1.传统同步请求参数 accept t ...
Ajax异步请求（重渲染DOM元素时，如何自动调用并执行JS自定义函数【含代码】）- 案例篇
文章目录 Ajax异步请求(重渲染DOM元素时,如何自动调用并执行JS自定义函数[含代码])- 案例篇效果截图: 重要代码: 附:全部HTML代码: Ajax异步请求(重渲染DOM元素时,如何自动调 ...
maven工程 java 实现文件上传 SSM ajax异步请求上传
java ssm框架实现文件上传实现:单文件上传.多文件上传(单选和多选),并且用 ajax 异步刷新,在当前界面显示上传的文件首先springmvc的配置文件要配置上传文件解析器: 1 < ...
Ajax异步请求原理和过程
Ajax异步请求原理和过程 1.什么是Ajax 2.AJAX创建异步对象XMLHttpRequest ( 考虑兼容性 ) 3.操作XMLHttpRequest 对象 1.什么是Ajax Ajax是一种 ...
layui-tree实现Ajax异步请求后动态添加html元素
最近在弄一个产品分类管理,是一个树形菜单的形式,用的是layui-tree ,由于它并没有动态添加节点,所以只能自己刚了. 大概效果如左图具体的实现是当我鼠标移入"长袖"这个分类 ...
ajax异步请求数据库实现级联下拉菜单。
ajax实现级联下拉菜单,使用Springboot实现. 思路很简单,使用ajax异步请求数据库数据即可. 文末有项目源码! 实现效果: 废话不多说,现在我们来开始实现! 第一步. 创建三张表:省.市 ...
ajax异步请求——form表单提交及表单序列化提交
ajax异步请求 AJAX介绍 AJAX 指异步 JavaScript 及 XML(Asynchronous JavaScript And XML),它不是一种新的编程语言,而是一种使用现有标准的新方 ...

JavaScript小记——Ajax异步请求

Ajax介绍

Ajax使用

ES6拼串语法

JavaScript小记——Ajax异步请求相关推荐

最新文章

热门文章