BOM
- BOM是browser object model的缩写，简称浏览器对象模型。
- 浏览器对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。
- Window是BOM中的核心对象。
1. window.onload 和 document.onDOMContentLoaded 有什么区别？
- 当使用window.onload时，页面上所有的DOM、样式表、脚本、图片、flash都已经加载完成。
- 当使用document.onDOMContentLoaded时，仅当DOM加载完成不包括样式表、图片、flash。
2. 如何获取图片真实的宽高？
document.querySelector("img").onload = dunction() {
console.log(this.width);
console.log(this.height);
3. 如何获取元素的真实宽高？
//假如我要获取名为body元素的宽高
console.log(body.offsetHeight)
console.log(body.offsetWidth)
4. URL 如何编码解码？
JavaScript中提供了四个URL编码方法：
- encodeURI()
用于转码整个 URL。它的参数是一个字符串，代表整个 URL。它会将元字符和语义字符之外的字符，都进行转义。不会对ASCII字母、数字、~!@#$&*()=:/,;?+'
字符编码 。
encodeURI('http://www.example.com/q=春节')
// "http://www.example.com/q=%E6%98%A5%E8%8A%82"
- encodeURIComponent()
用于转码 URL 的组成部分，会转码除了语义字符之外的所有字符，即元字符也会被转码。所以，它不能用于转码整个 URL。它接受一个参数，就是 URL 的片段。不会对ASCII字母、数字、~!*()' 字符编码。
注意：encodeURIComponent()会连 URL 元字符一起转义，所以如果转码整个 URL 就会出错。
encodeURIComponent('春节')
// "%E6%98%A5%E8%8A%82"
encodeURIComponent('http://www.example.com/q=春节')
//"http%3A%2F%2Fwww.example.com%2Fq%3D%E6%98%A5%E8%8A%82"
- decodeURI()
用于整个 URL 的解码。它是encodeURI()方法的逆运算。它接受一个参数，就是转码后的 URL。
decodeURI('http://www.example.com/q=%E6%98%A5%E8%8A%82')
// "http://www.example.com/q=春节"
- decodeURIComponent()
用于URL 片段的解码。它是encodeURIComponent()方法的逆运算。它接受一个参数，就是转码后的 URL 片段。
decodeURIComponent('%E6%98%A5%E8%8A%82')
// "春节"
5.为什么要编码？
- URL就是网址，只要上网，就一定会用到。
- 只有字母和数字[0-9a-zA-Z]、一些特殊符号“$-_.+!*'(),”[不包括双引号]、以及某些保留字，才可以不经过编码直接用于URL。
- 如果URL中有汉字，就会导致乱码。
- URL参数字符串中如果包含”&”或者”%”势必会造成服务器解析错误。
- 不同情况浏览器，网页，编码的处理方式不同。也会导致编码混乱不堪。
怎么解决上述问题？
使用Javascript先对URL编码，然后再向服务器提交，不要给浏览器插手的机会。因为Javascript的输出总是一致的，所以就保证了服务器得到的数据是格式统一的。
6. cookie & session &localStorage 分别是什么？
cookie
- 会跟随请求被发送到服务器上
- 是存储在浏览器上的一小段数据，用来记录某些当页面关闭或者刷新后仍然需要记录的信息
- 一般浏览器存储cookie 最大容量为4k，所以大量数据不要存到cookie。
- 有个数限制，不同浏览器下，一个域名下cookie的个数有限，并且限制数量可能不一样
session
- 当一个用户打开一个页面登录后，刷新浏览器仍然展示登录状态。服务器如何分辨这次发起请求的用户是刚才登录过的用户呢 这里就使用了session保存状态。用户在输入用户名密码提交给服务端，服务端验证通过后会创建一个session用于记录用户的相关信息，这个 session 可保存在服务器内存中，也可保存在数据库中。
- 创建session后，会把关联的session_id 通过setCookie 添加到http响应头部中。
- 浏览器在加载页面时发现响应头部有 set-cookie字段，就把这个cookie 种到浏览器指定域名下。
- 当下次刷新页面时，发送的请求会带上这条cookie， 服务端在接收到后根据这个session_id来识别用户。
- cookie 是存储在浏览器里的一小段「数据」，而session是一种让服务器能识别某个用户的「机制」，session 在实现的过程中需要使用cookie。 二者不是同一维度的东西。
localStorage
- localStorage HTML5本地存储web storage特性的API之一，用于将大量数据（最大5M）保存在浏览器中，保存后数据永远存在不会失效过期，除非用 js手动清除。
- 不参与网络传输。
- 一般用于性能优化，可以保存图片、js、css、html 模板、大量数据。
- 总体数量无限制
