本人学习积累的一些知识点分享（1）
本人学习积累的一些知识点分享（1）
- 为什么要初始化CSS样式
- cookie 和session 的区别
- 对canvas的理解
- WebSocket与消息推送
- http状态
- src与href的区别
- 标签种类
- 如何实现浏览器内多个标签页之间的通信
- Label的作用是什么
- iframe有那些缺点
- 浏览器内核的理解
- vertical-align
- 请指出 JQuery中 ".bind()"、".live()" 和 "delegate()" 的区别
- 请列举三种减低页面加载时间的方法。
- CSS 选择器的优先级别顺序？
- 为什么将js脚本放在底部而不是头部
- parseInt('1',基数);-->要换算成10进制
- 使用 let 或const 命令声明变量之前，该变量都是不可用的(不会发生变量提升了)
为什么要初始化CSS样式
因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对CSS初始化往往会出现浏览器之间的页面显示差异。
最简单的初始化方法就是： * {padding: 0; margin: 0;} （不建议）
cookie 和session 的区别
cookie数据存放在客户的浏览器上，session数据放在服务器上
考虑到安全应当使用session,考虑到减轻服务器性能方面,应当使用cookie
cookie数据存储较小,单个cookie保存的数据不能超过4K,session数据存储较大
所以个人建议：
将登陆信息等重要信息存放为session中
其他信息如果需要保留，可以放在cookie 中
cookie虽然在持久保存客户端数据提供了方便，分担了服务器存储的负担(用户多,cookie的作用就体现了)
cookie优点：极高的扩展性和可用性
cookie缺点：
A.cookie数量和长度的限制（优于cookie是由url键值对的形式传递的）
B.安全性问题 (cookie数据存放在客户的浏览器上)
对canvas的理解
canvas是HTML5中新增一个HTML5标签与操作canvas的javascript API
它可以实现在网页中完成动态的2D与3D图像技术
有一个基于 JavaScript 的绘图API
canvas可以完成动画、游戏、图表、图像处理等原来需要Flash完成的一些功能
SVG 和 VML 使用一个 XML 文档来描述绘图。SVG 绘图很容易编辑与生成，但功能明显要弱一些
WebSocket与消息推送
B/S架构(浏览器客户端/服务器端)的系统多使用HTTP协议，HTTP协议的特点：
A.无状态协议（标准的http协议是无状态的，无连接的）
B.用于通过 Internet 发送请求消息和响应消息
C.使用端口接收和发送消息，默认为80端口
http状态
HTTP是无状态协议,无连接协议
HTTP使用TCP的服务,HTTP本身是无状态协议,TCP是有状态协议
为了读网页用，网页取到了你可能花个10分钟来读它，所以这10分钟连接是没有必要的，所以马上就断开了（节省服务器端资源/无连接）
HTTP每次请求都是独立的（无状态）
所以用户是否还在浏览它的网页服务端不知道，因此就出现了cookie，session这类东西来弥补,让使用HTTP的应用有状态
由于HTTP协议是无状态的协议，所以服务端需要记录用户的状态时，就需要用某种机制来识具体的用户，这个机制就是Session （SessionId）
典型的场景比如购物车，当你点击下单按钮时，由于HTTP协议无状态，它并不知道是哪个用户操作的,所以服务端为特定的用户创建了特定的Session,用于标识这个用户，并且跟踪用户，这样才知道购物车里面有几本书。这个Session是保存在服务端的，有一个唯一标识。
udp是为了提高效率，但是tcp已经很高效了，没必要用udp（udp相当于tcp是高效）
TCP的面向连接是传输层的，而HTTP的无状态则是应用层的
src与href的区别
src用于替换当前元素(路径)，href用于在当前文档和引用资源之间确立联系(例如:超链接)
建议使用link方式来加载css（并行下载资源并且不会停止对当前文档的处理），而不是使用@import方式（因为@import需要页面网页完全载入以后加载）
link支持使用Javascript控制DOM去改变样式,而@import不支持
标签种类
自然样式标签
b, i, u, s, pre
语义样式标签
strong, em, ins, del, code
如何实现浏览器内多个标签页之间的通信
可以调用localstorge、cookies等本地存储方式
Label的作用是什么
label标签来定义表单控制间的关系,当用户选择该标签时，浏览器会自动将焦点转到和标签相关的表单控件上
iframe有那些缺点
iframe会阻塞主页面的Onload事件
搜索引擎的检索程序无法解读这种页面,不利于SEO
浏览器内核的理解
渲染引擎：负责取得网页的内容（HTML、XML、图像等等）、整理讯息（例如加入CSS等）,浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同
JS引擎：解析和执行javascript来实现网页的动态效果
最开始渲染引擎和JS引擎并没有区分的很明确，后来JS引擎越来越独立，内核就倾向于只指渲染引擎
vertical-align
与vertical-align对应的是text-align
请指出 JQuery中 “.bind()”、".live()" 和 “delegate()” 的区别
A. bind：把函数直接绑定到指定元素的指定事件上
B. live：把函数绑定到document上，接收选择器和事件类型作为参数，当触发一个元素的事件的时候，会利用事件冒泡到document上这一特性，判断事件目标元素和绑定参数中的选择器是否匹配，如果匹配则执行绑定函数的执行
C. delegate：和live有点类似，但是可以指定绑定元素，而不是document，其他和live一致，但是比live更加灵活
请列举三种减低页面加载时间的方法。
（加载时间指感知的时间或者实际加载时间）
- 减少实际加载时间 (文件传输时间)
B. 减少 http 请求（合并文件、合并图片）
C. 压缩 JavaScript、CSS 代码
D. 启用服务器压缩传输（如 gzip） - 减少感知时间 (代码执行时间)
A. script 外部脚本加载放到最后执行
B. 按需加载资源（如：只加载当前能看到的区域的图片）
CSS 选择器的优先级别顺序？
id > class > tag > *
为什么将js脚本放在底部而不是头部
当浏览器解析到该元素时,会暂停其他资源的下载和处理，直到将该资源加载、编译、执行完毕，图片和框架等元素也如此,类似于将所指向资源嵌入当前标签内
parseInt(‘1’,基数);–>要换算成10进制
基数表明第一个参数当前的进制
使用 let 或const 命令声明变量之前，该变量都是不可用的(不会发生变量提升了)
这在语法上，称为 “暂时性死区”（ temporal dead zone，简称 TDZ）