怎样理解AJAX
AJAX: Asynchronous JavaScript and XML, 翻译过来就是: 异步的JavaScript与XML
这已经成为了一个通用名词, 字面意义已经消失了, 因为现在使用JavaScript异步请求返回的数据基本都是JSON, 而非 XML.
概括起来, AJAX指的就是: 通过 XMLHttpRequest对象发出HTTP请求, 得到服务器返回的数据后再进行处理的这样一种技术.
下面是一个简单的AJAX请求实例:
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
// 通信成功时,状态值为4
if (xhr.readyState === 4){
if (xhr.status === 200){
console.log(xhr.responseText);
} else {
console.error(xhr.statusText);
}
}
};
xhr.onerror = function (e) {
console.error(xhr.statusText);
};
xhr.open('GET', '/endpoint', true);
xhr.send(null);
总结起来, 使用AJAX有这样几个步骤:
1. 创建XMLHttpRequest实例对象
2. 发出HTTP请求
3. 接收服务器传回的数据
4. 更新网页数据
注意:
1. 使用AJAX最大的优点是它可以不用刷新整个页面, 提升性能的同时不会打断用户正在做的事情;
2. AJAX只能向同源网址发出HTTP请求, 跨域会报错.
怎样理解AJAX的更多相关文章
- 通过回调函数的理解来进一步理解ajax及其注意的用法
一,再一次理解回调函数 (function($){ $.fn.shadow = function(opts){ //定义的默认的参数 var defaults = { copies: 5, opaci ...
- JavaScript大杂烩12 - 理解Ajax
AJAX缘由 再次谈起这个话题,我深深的记得就在前几年,AJAX被炒的如火如荼,就好像不懂AJAX,就不会Web开发一样.要理解AJAX为什么会出现,就要先了解Web开发面临的问题. 我们先来回忆一下 ...
- 深入理解ajax系列第八篇——表单提交
前面的话 在以前,网站的用户与后端交互的主要方式是通过HTML表单的使用.表单的引入在1993年,由于其简单性和易用性,直到电子商务出现之前一直保持着重要位置.理解表单提交,对于更深入地理解ajax是 ...
- 深入理解ajax系列第八篇
前面的话 在以前,网站的用户与后端交互的主要方式是通过HTML表单的使用.表单的引入在1993年,由于其简单性和易用性,直到电子商务出现之前一直保持着重要位置.理解表单提交,对于更深入地理解ajax是 ...
- 快速理解-Ajax
AJAX即“Asynchronous JavaScript and XML”,意思是异步JavaScript和XML,是指一种创建交互式网页的网页开发技术. 虽然现在很少有人去自己手动写AJAX,大多 ...
- 逐渐深入地理解Ajax
Ajax的基本原理是:XMLHttpRequest对象(简称XHR对象),XHR为向服务器发送请求和解析服务器响应提供了流畅的接口.能够以异步方式从服务器获得更多信息.意味着用户不必刷新页面也能取得新 ...
- 理解Ajax
1.优化原则 优化的目的是希望降低程序的整体开销.虽然在程序中有许多因素可以优化,但是通常人们会认为这个开销就是程序的执行时间.其实我们更应该把重点放在对程序整体开销最大的那部分. 2.一切都是权 ...
- 深入理解ajax系列第一篇——XHR对象
× 目录 [1]创建对象 [2]发送请求 [3]接收响应[4]异步处理[5]实例演示 前面的话 ajax是asynchronous javascript and XML的简写,中文翻译是异步的java ...
- JAVA EE 项目经常使用知识 之AJAX技术实现select下拉列表联动的两种使用方法(让你真正理解ajax)
ajax 下拉列表联动的使用方法. ajax的定义: AJAX 是一种用于创建高速动态网页的技术. 通过在后台与server进行少量数据交换,AJAX 能够使网页实现异步更新.这意味着能够在不又一次载 ...
- 通过实例来理解ajax
点击一个按钮,然后将信息显示到指定的div内. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"& ...
随机推荐
- pwn学习日记Day9 基础知识积累
知识杂项 libc是Linux下的ANSI C的函数库. LOOKUP函数 数组形式:公式为= LOOKUP(lookup_value,array) 式中 array-包含文本.数字或逻辑值的单元格区 ...
- iOS-VideoToolbox硬编码H264
前言 VideoToolBox是iOS8之后,苹果开发的用于硬解码编码H264/H265(iOS11以后支持)的API. 对于H264还不了解的童鞋一定要先看下这边的H264的简介. 编码流程 我们实 ...
- vue js select下拉框
<template> <ul id="select"> <li> <div class="select-head"&g ...
- Flutter路由跳转父级页面向子页面传参及子页面向父级页面传参
Flutter中页面通过路由跳转传参主要分两种,一种是通过push()跳转时根据设定的参数进行传参,另一种是通过pop()返回时进行传参. 父级页面向子页面push()传参 假设从A页面跳到B页面可能 ...
- arcpy workspace already in transaction mode
arcpy workspace already in transaction mode RuntimeError: workspace already in transaction mode 同一个工 ...
- 网络时间协议 (SNTP)
sntp是简单网络时间协议(Simple Network Protocol)的客户端,可以用来查询或修正NTP服务器的时间和本地的时差. sntp可以以非交互模式运行或运行一个计划任务的脚本. snt ...
- API网关的用处
API网关我的分析中会用到以下三种场景. Open API. 企业需要将自身数据.能力等作为开发平台向外开放,通常会以rest的方式向外提供,最好的例子就是淘宝开放平台.腾讯公司的QQ开发平台.微信开 ...
- 如何在国内使用google
而Google却一直坚持“机器算法”至上,让信息以公正的排序结果呈现,对于IT人员来说国内不能用google进行搜索是很痛苦的. 公司邮件介绍了一些方法,mark一下还是很有用的. http://ww ...
- 一百三十五:CMS系统之UEditoe编辑器集成以及配置将图片上传到七牛
富文本编辑框,选择UEditor 下载地址:http://ueditor.baidu.com/website/download.html 使用说明:http://fex.baidu.com/uedit ...
- [Scikit-learn] Yield miniBatch for online learning.
From: Out-of-core classification of text documents Code: """ ======================= ...