（web前端笔记）2020-12-23（ajax）

From web sites to web applications

client/server

bs架构带来了和cs架构完全不同的形式

basic three-tier(三次架构)

• user interface，business or process logic，and a data access module
• 用户层，业务逻辑层，数据层

model-view-controller

rich internet applicants

【变化】从cs胖客户端到bs架构瘦客户端，不断的融合

web applications revisited

传统的interface=html+css+js+images

• 功能上不够丰富
• GUI不够自然

瘦客户端：采用同步通信（点击之后，等待服务器响应的过程：有等待阶段）

RIA的好处

• 不需要安装
• 升级简单
• 网络上易获得
• 更多的UI界面
• 响应性更好
• CS端之间的平衡
• 异步通信（去除了等待的环节）
• 网络高效

不足

• 搜索引擎的损失
• 专业性
• 整体性的确实
• 打破了以往的范式

RIA的获取

• 浏览器的插件

AGAX

同步通信：所有信息的改变使得页面被刷新一次

异步通信：

传统的server 和interface传送的是html 和css

ajax传送的是 xml data

ajax的事件处理

优点

• 更好的交互
• 更好的使用
• 减少了web服务器的连接
• 减少了贷款

缺点

• 浏览器的历史
• 书签可能没用
• 依赖js的特性
• 网络延时导致不可用
• 搜索引擎不太友好

XMLHTTPREQUEST

xmlhttprequest 对象

• 是最重要的组件agax
• 传输xml数据并且使用http从网站服务器
• 独立的连接在客户和服务器
• 进行操作 （发送，接受和动态的更新）

处理流程

基本特点

属性	描述
请求的状态	0 没有打开
	1 open调用但是send（）没有调用
	2
	3 下载数据

open（method,url)

open(method,url,asy)

基本的语法

variable= new XMLHttpRequest();

定义响应的处理事件

先定义可state码，然后再检查返回码

/#后缀其他的信息，并且符合url的语法规则

LIMITS OF AJAX

two-request-limit

TIPS

最佳实践

为工作选择正确的格式，有的下载比较快，有的解析比较快，有的通讯效率高。

• xml

  严格的模式，标准严格（在客户端和服务器都可以用）

  分析语法有一定的歧义性

• json

  • 轻量级的数据标签
    • 键值对的标签
    • 简单形式（简写，键我们可以进行简写）
    • 数组形式（连键都没有了，双方约定了顺序）

• Json -p

  • 带padding 的json

最好和你自己定义的，分隔符的方式相同