JavaScript之Ajax

什么是服务器

    网页浏览过程分析

    如何配置自己的服务器程序(AMP)      WAMP\TOMCAT

什么是Ajax

 Ajax,是 AsynchronousJavaScript + XML 的简写。 这种技术能够向服务器请求额外的数据而无须卸载页面(即刷新) ,会带来更好的用户体验。

Ajax 技术核心是 XMLHttpRequest 对象(简称 XHR)


创建Ajax对象

    new XMLHttpRequest();

    new ActiveXObject('Microsoft.XMLHTTP')     //IE6

Open()

xhr.open('get', 'demo.php', false); //对于 demo.php 的 get 请求,false 同步

三个参数: 要发送的请求类型   (get 、post)、请求的 URL 和表示是否异步


同步与异步

    同步:任务一个一个的处理,异步:所有事情一起做

GET 与 POST

在提供服务器请求的过程中,有两种方式,分别是:GET 和 POST。在 Ajax 使用的过程中,GET 的使用频率要比 POST 高。


发送请求      send()     

接收服务器返回的信息        onreadystatechange

readyState

0 未初始化 尚未调用 open()方法

1 启动 已经调用 open()方法,但尚未调用 send()方法

2 发送 已经调用 send()方法,但尚未接受响应

3 接受 已经接受到部分响应数据

4 完成 已经接受到全部响应数据,而且可以使用


status         HTTP 状态码

200  OK  服务器成功返回了页面

400 Bad Request 语法错误导致服务器不识别

401 Unauthorized 请求需要用户认证

404 Not found 指定的 URL 在服务器上找不到

500 Internal Server Error 服务器遇到意外错误,无法完成请求

503 ServiceUnavailable 由于服务器过载或维护导致无法完成请求

responseText 作为响应主体被返回的文本

status 状态


Ajax数据:

数据类型

    什么叫数据类型——英语、中文

    XML、Json

字符集

    所有文件字符集相同


XML 的结构化数据过于烦琐、冗长。为了解决这个问题,JSON 的结构化数据出现了。JSON 是 JavaScript 的一个严格的子集,利用 JavaScript 中的一些模式来表示结构化数据。

JSON 的语法可以表示三种类型的值:

     1.简单值: 可以在 JSON 中表示字符串、 数值、 布尔值和 null。 但 JSON 不支持 JavaScript中的特殊值 undefined。

     2.对象:顾名思义。

     3.数组:顾名思义。

模拟加载 JSON 文本文件的数据,并且赋值给变量。

     var box = '[{"name" : "a","age" : 1},{"name" : "b","age" : 2}]';


使用Ajax

    基础:请求并显示静态TXT文件

         字符集编码

         缓存、阻止缓存

   动态数据:请求JS(或json)文件

        eval的使用

       DOM创建元素

   局部刷新:请求并显示部分网页文件

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

友情链接更多精彩内容