一：BOM(Browser Object Model)浏览器对象模型
提提供里对立与内容而与浏览器窗口进行交互的现象，其核心对象是window。
1：alert
alert函数：用于进行window窗口的弹出，提示内容写在alert（）函数括号内， //使用弹出框警告可以有以下的两种表达方式 alert("弹出框");window.alert("window的弹出框");;window可以省略
2：confirm确定框：
confirm函数存在返回值true和false，括号内输入提示信息， 根据点击的操作来进行返回值，确认代表true，取消代表false。
你是一个好学生吗
如果是 就alert出 继续加油
如果不是 就alert出 我还要努力
if( confirm('你是一个好学生吗？') ){
alert('继续加油')
}else{
alert('我还要努力')
}
复制代码
3：prompt ：
prompt函数的第一个参数是输入框上的问题，第二参数是输入框中的默认值（可以不写第二个参数）
let v = prompt('今天你快乐吗','快乐')
alert(v)
复制代码
4：定时器：
setTimeout函数：
setTimeout的函数第一个参数代表等待执行的函数， 第二参数是等待的时间，该函数只执行一次，主要起的效果就是延迟执行。 语法：setTimeout(回调函数，延迟时间) 延迟时间默认是毫秒，如果不填默认是0，立即执行
setInterval函数：
setInterval起到了周期性定时器的效果 是一个重复执行的函数，第一个参数是重复执行的循环体部分，第二个参数是执行任务的间隔时间。 语法：setInterval(回调函数，延迟时间)
清除定时器函数：
定时器清除函数clearInterval，clearTimeout用于停止周期性定时器
案列： 再过一秒钟 打印出2 .... 点击清除定时器 终止打印
<button onclick="clearfn()">清除定时器</button>
let i = 0;
let id = setInterval(function () {
i++;
console.log(i);
}, 1000)
function clearfn() {
clearInterval(id)
}
复制代码
两个定时器的区别：
setTimeout()是等延迟时间到了之后执行一次函数
setInterval()是每过一次延迟时间就执行一次函数，他是重复执行的
二、location对象常用属性
（1）location.host：可获取到当前的主机名称和端口号（倘若没有端口号将只显示主机名称） （2）location.port：这个是地址的端口 （3）location.href：获取当前地址的完整URL （4）location.search：这个是地址的参数信息 （5）location.reload()函数：可用于当前网页的刷新。使用方法：location.reload() ; （6）location.replace()函数：用于URL地址的替换，相当于用一个新的网页地址替换了当前网页所在地址，并且不具备history的记忆。 使用方法：location.replace(“新的URL”);
三：history对象
方法：
后退：
window.history.back()
window.history.go(-1);
复制代码
前进：
window.history.forward();
window.history.go(1)
复制代码
刷新
go里面是没有任何参数的
window.history.go();
location.reload();
复制代码
四：缓存 在打印台 找出Application 下面有sessionStorage里面的fiel，还有localStorage里面的fiel
1：sessionStorage (会话储存)
sessionStorage 存储之后 页面刷新 缓存的值不会消失， 但是 把tab页 或者叫 会话 关闭之后，缓存的值就不存在了
setItem设置 存储 getItem获取
案列：sessionStorage设置和取值 有两种方式写法
<button onclick="fn1()">设置sessionStorage</button>
<button onclick="fn2()">显示sessionStorage的值</button>
function fn1(){
setItem设置 存储
sessionStorage.stuNo = '1908'
sessionStorage.chinese = '90'
sessionStorage.setItem('stuNo','1099')
sessionStorage.setItem('chinese','80')
}
function fn2(){
/* getItem获取 */
document.write(sessionStorage.stuNo);
document.write(sessionStorage.chinese);
document.write(sessionStorage.getItem('stuNo'));
document.write(sessionStorage.getItem('chinese'));
}
复制代码
2：localStorage（本地储存）
localStorage会一直存储在本地，会话或者tab页关闭也不会消失
/localStorage是和地址有关系的，地址改变了，localStorage里面的值就不存在了 前面地址没有发生改变的话，localStorage依然存在 ，虽然页面改变了 案列：同理 localStorage设置和取值 有两种方式写法
function fn1(){
localStorage.setItem('car','bmw')
localStorage.car = 'bc'
}
function fn2(){
document.write(localStorage.getItem('car'));
document.write(localStorage.car);
}
复制代码
五：路径：
1：相对路径 ./B.html （文件名）B.html 相对路径 2：绝对路径 就是跳转到tab页面的搜索框的名 3：替换路径 用新的路径来替换当前的路径 replace代表替换，把会历史记录里面的地址也替换了，所以没有返回功能 location.replace('B.html') 4：新的页面窗口 window.open 会打开一个新的tab页 不会关闭之前的tab页 默认是 _blank*/
open('B.html','_blank') 打开新的窗口
和location.href功能一样 在原来的tab页上打开
open('B.html','_self')在当前的窗口打开
复制代码
六：清除缓存里面的内容
<button onclick="clearOne()">清除username</button>
<button onclick="clearAll()">清除全部</button>
function clearOne(){
/* 清除指定的一项 */
sessionStorage.removeItem('a')
}
function clearAll(){
/* 全部清除 */
sessionStorage.clear();
}
/* 在sessionStorage 设置多个值 写两个按钮 删除其中的一项
和删除全部 */
复制代码
重点特殊点：localStorage 或者 sessionStorage ，存的内容都是字符串类型*如果存储的是对象类型怎么处理
在a页面储存内容 之后跳转b页面显示name和age 本地存储 跳转B页面 function fn(){
let obj1 = {
name:"zhangsan",
age:20
}
/* JSON.stringify 把对象转成字符串类型 */
let s = JSON.stringify(obj1);
localStorage.s = s;
在b页面写
/* 再把字符串转成对象 */
let objs = JSON.parse(localStorage.s)
document.write(objs.name);
document.write(objs.age);
作者：用户8712537862007
链接：juejin.cn/post/704480…
来源：稀土掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
