Ajax原理以及优缺点

Ajax原理

1.Ajax的原理简单来说是在用户和服务器之间加了—个中间层(AJAX引擎),通过XmlHttpRequest对象来向服务器发异步请求,
2.从服务器获得数据,然后用javascript来操作DOM而更新页面。使用户操作与服务器响应异步化。
3.这其中最关键的一步就是从服务器获得请求数据
4.Ajax的过程只涉及JavaScriptXMLHttpRequestDOMXMLHttpRequest是ajax的核心机制

下面是代码

/** 1. 创建连接 **/
var xhr = null;
xhr = new XMLHttpRequest()
/** 2. 连接服务器 **/
xhr.open('get', url, true)
/** 3. 发送请求 **/
xhr.send(null);
/** 4. 接受请求 **/
xhr.onreadystatechange = function(){
	if(xhr.readyState == 4){
		if(xhr.status == 200){
			success(xhr.responseText);
		} else { 
			/** false **/
			fail && fail(xhr.status);
		}
	}
}

ajax有哪些优缺点那?

优点

  1. 通过异步模式,提升了用户体验.
  2. 优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用.
  3. ajax在客户端运行,承担了一部分本来由服务器承担的工作,减少了大用户量下的服务器负载。
  4. ajax可以实现动态不刷新(局部刷新)

缺点

  1. 安全问题 AJAX暴露了与服务器交互的细节。
  2. 对搜索引擎的支持比较弱。
  3. 不容易调试。

到这里也就结束了希望对您有所帮助。

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/239919.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

「Verilog学习笔记」简易秒表

专栏前言 本专栏的内容主要是记录本人学习Verilog过程中的一些知识点,刷题网站用的是牛客网 timescale 1ns/1nsmodule count_module(input clk,input rst_n,output reg [5:0]second,output reg [5:0]minute);always (posedge clk or negedge rst_n) begin if (~rst…

Axure电商产品移动端交互原型,移动端高保真Axure原型图(RP源文件手机app界面UI设计模板)

本作品是一套 Axure8 高保真移动端电商APP产品原型模板,包含了用户中心、会员成长、优惠券、积分、互动社区、运营推广、内容推荐、商品展示、订单流程、订单管理、售后及服务等完整的电商体系功能架构和业务流程。 本模板由一百三十多个界面上千个交互元件及事件组…

各地加速“双碳”落地,数字能源供应商怎么选?

作者 | 曾响铃 文 | 响铃说 随着我国力争2030年前实现“碳达峰”、2060年前实现“碳中和”的“双碳”目标提出,为各地区、各行业的低碳转型和绿色可持续发展制定“倒计时”时间表,一场围绕“数字能源”、“智慧能源”、“新能源”等关键词的创新探索进…

二百一十六、Flume——Flume拓扑结构之负载均衡和故障转移的开发案例(亲测,附截图)

一、目的 对于Flume的负载均衡和故障转移拓扑结构,进行一个开发测试 二、负载均衡和故障转移 (一)结构含义 Flume支持使用将多个sink逻辑上分到一个sink组 (二)结构特征 sink组配合不同的SinkProcessor可以实现负…

《地理信息系统原理》笔记/期末复习资料(10. 空间数据挖掘与空间决策支持系统)

目录 10. 空间数据挖掘与空间决策支持系统 10.1. 空间数据挖掘 10.1.1. 空间数据挖掘的概念 10.1.2. 空间数据挖掘的方法与过程 10.1.3. 空间数据挖掘的应用 10.2. 空间决策支持系统 10.2.1. 空间决策支持系统的概念 10.2.2. 空间决策支持系统的结构 10.2.3. 空间决策…

Onlyoffice本地部署超详细教程(附协作空间2.0新资讯)

陈老老老板🤴 🧙‍♂️本文专栏:生活(主要讲一下自己生活相关的内容)生活就像海洋,只有意志坚强的人,才能到达彼岸。 🧙‍♂️本文简述:ONLYOFFICE相信大家已经有所了解,本篇讲一下o…

mjpg-streamer配置其它端口访问视频

环境 树莓派4B ubuntu 20.04 U口摄像头 确认摄像头可访问 lsusb查看 在dev下可查看到video* sudo mplayer tv://可打开摄像头并访问到视频 下载mjpg-streamer并编译安装 在github下载zip包,下载的源码,需要编译安装 unzip解压 cd mjpg-streamer/mjp…

聚观早报 |一加12首销;华为智能手表释放科技温暖

【聚观365】12月12日消息 一加12首销 华为智能手表释放科技温暖 卡尔动力获地平线战略投资 英伟达希望在越南建立基地 努比亚Z60 Ultra影像规格揭晓 一加12首销 现在有最新消息,近日一加12该机已于昨日开售,售价4299元起。 外观方面,全…

【Axure高保真原型】个性化自定义图片显示列表

今天和大家分享个性化自定义图片显示列表的原型模板,鼠标点击多选按钮,可以切换按钮选中或者取消选中,按钮选中时,对应图片会在列表中显示,按钮取消后,对应图片会自动隐藏。那这个模板是用中继器制作的&…

[C++] 模板进阶(非类型模板参数,特化,分离编译)

文章目录 1、非类型模板参数2、模板的特化2.1 什么是模板特化2.2 函数模板特化2.3 类模板的实例化2.3.1 全特化2.3.2 偏特化 3、模板分离编译3.1 什么是分离编译3.2 模板的分离编译3.3 解决方法 4、模板总结 1、非类型模板参数 模板参数分类类型形参与非类型形参。 类型形参即…

flex布局,换行的元素上下设置间距

要生成的效果图如下: display:flexflex-direction: row;flex-wrap: wrap;当我们使用弹性盒子布局后,默认元素是没有外边距的,紧挨着样式就有点丑,如果想使换行后,元素的外边距有个距离,可以用如下方法解决…

MAC IDEA Maven Springboot

在mac中,使用idea进行maven项目构建 环境配置如何运行maven项目1.直接在IDEA中运行2.使用jar打包后执行 如何搭建spring boot1.添加依赖2.创建入口类3.创建控制器4. 运行5.其他 环境配置 官网安装IDEA使用IDEA的创建新项目选择创建MAEVEN项目测试IDEA的MAVEN路径是…

设计模式——原型模式(创建型)

引言 原型模式是一种创建型设计模式, 使你能够复制已有对象, 而又无需使代码依赖它们所属的类。 问题 如果你有一个对象, 并希望生成与其完全相同的一个复制品, 你该如何实现呢? 首先, 你必须新建一个属于…

(第61天)多租户架构(CDB/PDB)

背景介绍 Oracle 的 CDB 和 PDB 是 Oracle 12C 及以上版本中引入的新概念,用于管理多租户数据库环境。 Oracle 数据库是商业数据库领域中的翘楚,其强大的功能和高可靠性备受企业用户追捧。而随着云计算和大数据时代的到来,Oracle 也不断推出新的技术以适应这些变化。CDB 技…

【JavaWeb学习笔记】 9 - Servlet的相关类--ServletConfig、ServletContext、HttpServletRequest

ServletConfig 一、ServletConfig 1.ServletConfig介绍 1. ServletConfig类是为Servlet程序的配置信息的类 2. Servlet程序和ServletConfig对象都是由Tomcat负责创建 3. Servlet程序默认是第1次访问的时候创建,ServletConfig在Servlet程序创建时,就…

GEE:重分类

作者:CSDN @ _养乐多_ 本文记录了在 Google Earth Engine(GEE)平台上对一副类别图像进行重分类的代码。并以 COPERNICUS/Landcover/100m/Proba-V-C3/Global 数据集中的土地利用数据为例。 结果如下图所示, 文章目录 一、核心函数二、示例代码三、代码链接一、核心函数 核…

vue-如何实现带参数跳转页面

文/朱季谦 在vue框架的前端页面上,若要实现页面之间的带参数跳转,可参考以下实现过程: 例如,点击截图中的“查看试卷”,可实现带参跳转到相应的试卷页面,该功能类似查看试卷的详情页面: 假如以…

mfc110u.dll丢失的解决方法,mfc110u.dll丢失原因是什么?

在计算机使用过程中,我们经常会遇到一些错误提示,其中之一就是“mfc110u.dll文件丢失”。那么,mfc110u.dll是什么?为什么会出现丢失的情况呢?本文将为您详细介绍mfc110u.dll文件的含义、丢失原因以及解决方法。 首先&…

JavaScript-异常与this处理与性能优化

1. 深浅拷贝 const obj {uname: nidie,age: 18}// o对象直接复制obj,直接赋值将obj的地址也给了oconst o obj// 正常打印18console.log(o);// 对o改动,打印obj,obj也被改动了o.age 20console.log(o);console.log(obj);1.1 浅拷贝 拷贝对象…

AI日报:苹果为使用Mac的人工智能开发者推出开源工具

文章目录 总览主要介绍开发理念开发细节MLX功能用途 MLX可以用于商业软件吗? 总览 苹果正在为开发人员提供新的工具,用于在其硬件上训练和运行大型语言模型。 主要介绍 开发理念 苹果公司通过发布一系列新的开源人工智能工具,向开源人工智能…