web前端--HTML
1. Doctype
声明位于文档中的最前面的位置,处于html之前,此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。
如果html中省略了doctype,浏览器就会进入到Quirks模式的怪异状态,在这种模式下,有些样式会和标准模式存在差异
HTML5 只需要写 <!doctype html>
2.Quirks 模式和 Standards 模式有什么区别
会有布局、样式解析和脚本执行三个方面的区别
从 IE6 开始,引入了 Standards 模式,标准模式中,浏览器尝试给符合标准的文档在规范上 的正确处理达到在指定浏览器中的程度。<u>页面排版及 JS 解析是以该浏览器支持的最高标准来执行</u>
IE6 就假定如果写了 DTD,就意味着这个页面 将采用对 CSS 支持更好的布局,而如果没有,则采用兼容之前的布局方式。这就是 Quirks 模式,<u>主要用来兼容旧的浏览器,向后兼容</u>
3. cookies,sessionStorage 和 localStorage
<u>cookie是网站为了标示用户身份而储存在用户本地终端(Client Side)上的数据(通常经过加密)。</u>
当 web 服务器向浏览器发送 web 页面时,在连接关闭后,服务端不会记录用户的信息。
Cookie 的作用就是用于解决 "如何记录客户端的用户信息":
- 当用户访问 web 页面时,他的名字可以记录在 cookie 中。
- 在用户下一次访问该页面时,可以在 cookie 中读取用户访问记录。
- cookie存储空间大小约4kb, sessionStorage及localStorage空间比较大,大约5M
<u>localStorage的生命周期是永久性的。</u>
<u>sessionStorage 的生命周期是在浏览器关闭前。</u>
4. Html5新特性
。HTML5 现在已经不是 SGML 的⼦集,主要是关于图像,位置,存储,多任务等功能的增 加 绘画 canvas
。⽤于媒介回放的 video 和 audio 元素
。 localStorage与 sessionStorage
5.canvas和svg
svg 绘制出来的每⼀个图形的元素都是独⽴的 DOM 节点,能够⽅便的绑定事件或⽤来修改。 canvas 输出的是⼀整幅画布
svg 输出的图形是⽮量图形,后期可以修改参数来⾃由放⼤缩⼩,不会失真和锯⻮。⽽canvas 输出标量画布,就像⼀张图⽚⼀样,放⼤会失真或者锯⻮
6.输入URL到页面展示
- URL输入
检查URL合法性,完整性,查看缓存,有的话直接显示页面
-
DNS解析获取域名相应的IP地址
-
建立TCP链接,(三次握手,四次挥手)
-
HTTP传输(https)
-
服务器响应请求
浏览器发送初始http get请求(请求html文件),服务器发回http响应报文,包含响应头与html正文
- 渲染页面
- TCP断开连接(目前大都是保持长久连接直到页面关闭)