AJAX

历史

• ActiveX 对象（微软发明的，2002年,ie的一个插件）
  • 作用：可以用js发送一个请求（即4行字符串）
• firefox模仿，发明了一个 XMLHttpRequest 对象，即window.XMLHttpRequest，也可以用js发送请求
• 2005年 Gmail - AJAX
  • Async JavaScript And XML（异步的JavaScript和XML）

什么是请求（包括4部分，即4个字符串）

• 请求头，请求首部，回车，随便(即请求主体response.end('')里的内容)

• 浏览器可以发送一个请求（即构造请求，只有以下5种方法，而且每一种都有缺陷）

  1. 地址栏输入网址 //会把当前页面替换
  2. link rel=stylesheet href=xxxx.png /* 只能请求特定的资源
  3. img src=xxx.css
  4. script src=xxxx.png */
  5. form 表单也可以发请求（当用户提交） //会刷新页面

  注： 在AJAX发明之前，用户做任何操作都是要刷新页面的

• 响应头： response.setHeader()

  • 请求头也可以设置格式，即xhr.setRequestHeader()

• `(1左边的符号，里面包含的字符串可以换行)

• 跨域：两个不同域名的页面默认无法对对方进行任何访问，可以引用（注意是引用，不是下载或访问）对方的css或图片

• JSON：一个抄袭JavaScript的简单语法

  • JSON的本质是字符串，只是可以表示成对象的格式而已
  • 没有JSON对象这种说法，JSON始终都是一个字符串
  • JSON.parse() //把JSON字符串转化为符合JavaScript语法的对象

• readyState（看mdn）

  • 一般有5种状态（即0,1,2,3,4）

  值	状态	描述
  0	UNSENT (未打开)	open()方法还未被调用.
  1	OPENED (未发送)	send()方法还未被调用.
  2	HEADERS_RECEIVED (已获取响应头)	send()方法已经被调用, 响应头和响应状态已经返回.
  3	LOADING (正在下载响应体)	响应体下载中; responseText中已经获取了部分数据.
  4	DONE (请求完成)	整个请求过程已经完毕.

• readystatechange

  • 一个事件，监听readystate的变化，可以用onreadystatechange或者addEventListener("")绑定到xhr上

• url的格式

• '?'前面是路由，即地址，后面是参数

• onload 和 onreadystatechange

  • onload 是比较简单的 新的方法，当readyState的值等于4时，触发load事件
  • 也可以写成 addEventListener('load') 或者 addEventListener('readystatechange')

• xhr.status 和 xhr.readyState的区别

  • status 表示的是服务器的一个状态，表示数据是否正常
  • readyState 表示的是浏览器与服务器交互的一个过程的状态表示，表示交互过程是不是已经完毕

node工具怎么学习

• 输入命令就启动个静态服务器。更详细的用法在 npm上找到它，就有使用说明。以后遇到 node 工具，想找教程都在 npm 上搜索

node实现静态服务器

• ctrl + c 可以退出服务器

• 怎样理解浏览器

  • 浏览器本质就是一个工具，发送一个人请求，获得一些数据。获得的数据包括两部分，即相应头和响应体。浏览器根据相应头来解释响应体。响应体本质就是一堆字符串。

• 404表示没有文件，并不是说服务器不工作了。服务器如果不工作的话，连404都看不到。

• 路由

  • 路由就是域名后面的内容。后端可以根据路由去做对应的事情

• nodejs的两大功能

  • 做工具
  • 做网站

• XMLHttpRequest对象

  • 作用：向服务器发送请求并获取服务器返回的数据，并且不需要刷新页面