<div id="div1"><h3> 1, 输入url到页面渲染全过程<h3></div> - 1，DNS解析：将域名地址解析为ip地址 浏览器DNS缓存 —> 系统 DNS缓存 —> 路由器 DNS缓存 —> 网络运营商DNS缓存 —> 递归搜索 * 递归搜索： 比如： （blog.baidu.com） .com 域名下查找DNS解析 —> .baidu 域名下查找DNS解析 —> blog 域名下查找DNS解析 —> 出错了 - 2， TCP连接： TCP三次握手 * 第一次握手，由浏览器发起，告诉服务器我要发送请求了 * 第二次握手，由服务器发起，告诉浏览器我准备接受了，你赶紧发送吧 * 第三次握手，由浏览器发送，告诉服务器，我马上就发了，准备接受吧 - 3，发送请求： 请求报文（HTTP协议的通信内容） - 4， 接受响应： 响应报文 - 5，渲染页面 * 遇见HTML标记，浏览器调用HTML解析器解析成Token并构建成dom树 * 遇见style/link标记，浏览器调用css解析器，处理css标记并构建cssom树 * 遇见script标记，调用js解析器，处理script代码（绑定事件，修改dom树/cssom树） * 将dom树和cssom树合并成一个渲染树 * 根据渲染树来计算布局，计算每个节点的几何信息（布局） * 将各个节点颜色绘制到屏幕上（渲染） + 注意：这5个步骤不一定顺序执行，如果dom树和cssom树被修改了，可能会执行多次布局和绘制 - 6， 断开连接，TCP四次挥手 先是客服端给服务器发送FIN，要求关闭连接，服务器收到后会发送一个ACK进行确认。服务器然后再发送一个FIN，客户端发送ACK确认，并进入TIME_WAIT状态。等待2MSL后自动关闭 * 第一次挥手：由浏览器发起，告诉给服务器，我东西发送完了（请求报文），你准备关闭吧 * 第二次挥手：由服务器发起的，告诉浏览器，我东西接受完了（请求报文），我准备关闭了，你也准备吧 * 第三次挥手：由服务器发起，告诉浏览器，我东西送完了（响应报文），你准备关闭吧 * 第四次挥手：由浏览器发起，告诉服务器，我东西接受完了，我准备关闭了（响应报文），你也准备吧