JS-BOM编程
BOM编程
BOM是Browser Object Model的缩写，即浏览器对象模型
BOM是由一系列的对象组成，是访问、控制、修改浏览器的属性和方法（通过window对象及属性的一系列方法控制浏览器行为的一种编程）
window对象
window对象是浏览器提供给我们使用的，无需自己创建
-
window顶级对象：代表整个浏览器窗口
-
history对象：代表浏览器的访问历史
-
location对象：代表浏览器的地址栏
-
screen对象：代表屏幕
-
navigator对象：代表浏览器软件本身
-
document对象：代表浏览器窗口目前解析的html文档
-
console对象：代表浏览器开发者工具的控制台
-
localStorage对象：代表浏览器本地数据持久化储存
-
sessionStorage对象：代表浏览器本地数据会话级储存
-
-
window对象的API
-
history属性的API
- forward()：向后翻页
- back()：向前翻页
- go()；向前翻几页
- JavaScript Window History (w3school.com.cn)
-
location属性的API
- href：当前浏览器地址栏的网址（可通过此属性实现页面的跳转）
- JavaScript Window Location (w3school.com.cn)
-
console属性的API
- log()：使用控制台打印日志
三种弹窗方式
我们在前文已经学习到了三种弹窗方式，这三个API都是window对象本身的API
**在使用API时，我们的window.可省略不写
Storage API
- sessionStorage属性的API
- setItem()：存储数据
- getItem()：读取数据
- removeItem()：删除数据
- localStorage属性的API
- setItem()：存储数据
- getItem()：读取数据
- removeItem()：删除数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script>
function fun1() {
//使用key,value的键值对方式对storage进行存放数据
sessionStorage.setItem("keya", "valueA");
localStorage.setItem("keyb", "valueB");
}
function fun2() {
//使用key对storage进行读取数据
console.log(sessionStorage.getItem("keya"));
console.log(localStorage.getItem("keyb"));
}
function fun3() {
//使用key对storage进行删除数据
sessionStorage.removeItem("keya");
localStorage.removeItem("keyb");
}
</script>
</head>
<body>
<button id="btn1" onclick="fun1()">存数据</button>
<button id="btn2" onclick="fun2()">读数据</button>
<button id="btn3" onclick="fun3()">删数据</button>
</body>
</html>