imooc（二）

发表于 | 分类于 |

1.DOM事件类

基本概念：DOM 事件的级别 → DOM事件模型（冒泡和捕获） → DOM 事件流 → 描述DOM事件捕获的具体流程 → Event对象的常见应用 → 自定义事件

1.1事件级别

DOM0

1
element.onclick=function(){}

DOM2

1
2
3
4
5
element.addEventListener('click',function(){},false)

默认：false（冒泡）

true（捕获）

DOM3

1
element.addEventListener('keyup',function(){},false)

1.2事件模型

DOM事件模型包括冒泡型事件和捕获型事件。

冒泡型事件：事件从特定的事件目标到最不特定的事件目标的顺序触发。

捕获型事件：与冒泡事件相反，事件从最不精确的对象开始触发，然后到最精确。

1.3事件流

事件流包括三个阶段：事件捕获阶段–>处于目标阶段–>事件冒泡阶段。

首先发生的是事件捕获阶段，为截获事件提供了机会。然后是实际的目标接收事件。最后一个阶段是冒泡阶段。

image

1.4事件捕获和冒泡的具体流程

Window –> Document –> html –> body –> … –> 目标元素

1.5 Event对象的常见应用

event.preventDefault()：取消事件的默认动作。

event.stopPropagation()：阻止事件冒泡。

event.stopImmediatePropagation()：如果一个元素上绑定了多个事件，若其中某个事件执行了此方法，那么后续的事件将不再执行。

event.currentTarget()：返回其监听器触发事件的节点，即当前处理该事件的元素、文档或窗口。

event.target()：返回事件的目标节点（触发该事件的节点），如生成事件的元素、文档或窗口。

1.6自定义事件

1
2
3
4
5
6
7
var event = new Event('build');

// Listen for the event.
elem.addEventListener('build', function (e) { ... }, false);

// Dispatch the event.
elem.dispatchEvent(event);

CustomEvent

2. HTTP协议类

HTTP协议的主要特点 → HTTP报文的组成部分 → HTTP方法 → POST 和 GET 的区别 → HTTP 状态码 → 什么是持久连接 → 什么是管线化

2.1 HTTP协议的主要特点

一、简单快速：客户端向服务器请求服务时，只需传送请求方法和路径。

二、灵活：HTTP允许传输任意类型的数据对象。

三、无连接：服务器处理完客户端的请求并收到客户端的应答后，即断开连接。采用这种方式可以节省传输时间。

四、无状态：指协议对于事务处理没有记忆能力。缺少状态意味着如果后续处理需要前面的信息，则它必须重传，这样可能导致每次连接传送的数据量增大。

2.2 HTTP报文的组成部分

HTTP 报文的组成部分

一、请求报文：请求行、请求头、空行、请求体。

二、响应报文：状态行、响应头、空行、响应体。

2.3 HTTP方法

一、GET：获取资源

二、POST：传输资源

三、PUT：更新资源

四、DELETE：删除资源

五、HEAD：获得报文首部

2.4 POST和GET的区别（重要）

POST和GET的区别

  • GET 在浏览器回退时是无害的，而 POST 会再次提交请求
  • GET 请求会被浏览器主动缓存，而 POST 不会，除非手动设置
  • GET 请求参数会被完整保留在浏览器历史记录里，而 POST 中的参数不会被保留
  • GET 请求在URL中传送的参数是有长度限制的，而 POST 没有长度限制
  • 与 POST 相比，GET 的安全性较差，因为 GET 的参数直接暴露在URL上，所以不能来传递敏感信息
  • GET 参数通过 URL 传递，POST 放在 Request body中

2.5 HTTP 状态码

HTTP 状态消息

  • 1XX：指示信息 - 表示请求已收到，继续处理
  • 2XX：成功 - 表示请求已被成功接收
  • 3XX：重定向 - 要完成请求必须进行更进一步操作
  • 4XX：客户端错误 - 请求有语法错误或请求无法实现
  • 5XX：服务器错误 - 服务器未能实现合法的请求

2.6 持久连接

HTTP 协议采用“请求 - 应答”模式，当使用普通模式，即非 Keep-Alive 模式时，每个请求/应答客户和服务器都要新建立一个连接，完成之后立即断开连接（HTTP协议为无连接的协议）。

当使用 Keep-Alive 模式（又称持久连接、连接重用）时，Keep-Alive 功能使客户端到服务器端的连接持久有效，当出现对服务器的后续请求时，Keep-Alive 功能避免了建立或者重新建立连接。

Keep-Alive 模式在 HTTP/1.1支持，HTTP/1.0 不支持。

image

2.7 管线化

HTTP管线化可以克服同域并行请求限制带来的阻塞，它是建立在持久连接之上，是把所有请求一并发给服务器，但是服务器需要按照顺序一个一个响应，而不是等到一个响应回来才能发下一个请求，这样就节省了很多请求到服务器的时间。

image

管线化机制须通过永久连接（persistent connection）完成，仅 HTTP/1.1 支持此技术（ HTTP/1.0 不支持），并且只有 GET 和 HEAD 要求可以进行管线化，而POST则有所限制。此外，初次创建连接时也不应启动管线机制，因为对方（服务器）不一定支持 HTTP/1.1 版本的协议。

------ 本文结束 ------
0%