Window的相关方法与本地储存

一、Windowde基础方法

1、innerWidth：获取当前可视窗口的宽
2、innerHeight：获取当前可视窗口的高
3、alert：提示框
4、confirm：询问框
5、prompt：输入框
6、location.href：网页跳转
7、reload：刷新
8、onload：页面所有资源加载完成后会执行
9、onresize：检查浏览器窗口的变化
10、onscroll：滚动距离
11、document.documentElement.scrollTop：
document.body.scrollTop ：垂直滚动距离
12、document.documentElement.scrollLeft：
document.boby.scrollLeft：横向滚动距离
13、scrollTo：回到指定位置
14、open：新页面打开网页
15、close：关闭当前网页
16、history.back：后退，回到上一网页
17、history.forward：前进，加载历史列表中的下一个URL
18、history.go：正数是前进，负数是后退

二、本地储存

localStorage:永久储存，在关闭当前页面后依然或保留储存的数据
sessionStorage：临时储存，关闭当前页面后会清除储存
用法：setItem（存）、getItem（取）、removeItem（删）、clear（全部删除）

三、获取节点

1、document.head：head节点
2、document.body：body节点
3、document.getElementById：通过id获取节点
4、getElementsByClassName：通过class获取节点
5、getElementsByTagName：通过标签获取节点
6、getElementsByName：通过name获取节点
7、document.querySelector：写法与css类似，只会返回一个对象（案例可看瀑布流）
8、document.querySelectorAll：获取所有节点，可以配合class使用（案例可看瀑布流）
9、childNodes：获取所有节点

var x = document.getElementById('box')
        var y = x.childNodes
            console.log(y);

10、children：获取所有元素节点
11、firstChild：获取第一个节点
12、firstElementChild：获取第一个元素节点
13、lastChild：获取最后一个节点
14、lastElementChild：获取最后一个元素节点
15、previousSibling：获取上一个兄弟节点
16、previousElementSibling：获取上元素兄弟节点
17、nextSibling：获取下个兄弟节点
18、nextElementSibling：获取下个元素兄弟节点
19、parentNode：获取父节点
20、parentElement：获取父元素节点
21、getAttribute：获取属性节点，接收一个值，属性名
22、attributes：获取所有属性节点

四、自定义属性

setAttribute：设置属性
getAttbute：获取属性
removeAttibute：删除属性

五、节点的操作

1、 document.createElement：创造节点
2、document.appendChild：插入节点，插入在后面
3、document.insertBefore：插入中间，接收两个参数，第一个要插入的节点，第二个插入到谁的前面
4、document.removeChild：删除节点
5、remove：删除自身与后代
7、 document.replaceChild：替换节点，接收两个参数，第一个需要替换的节点，第二个是被替换的节点
8、cloneNode：克隆节点，默认 false不克隆后代，true克隆后代

六、获取尺寸

1、document.documentElement.offsetWidth：获取元素宽（内容+边框+内填充）
2、document.documentElement.offsetHeight：获取元素高（内容+边框+内填充）
3、document.documentElement.clientWidth：获取元素宽（内容+内填充）
4、document.documentElement.clientHeight：获取元素高（内容+内填充）
5、document.documentElement.offsetLeft：获取相对与父元素左偏移
6、document.documentElement.offsetTop：获取相对与父元素上偏移
7、document.documentElement.clientWidth：获取可视窗口的宽
8、document.documentElement.clientHeight：获取可视窗口的高