一、BOM
1、概念：Browser Object Model 浏览器对象模型
* 将浏览器的各个组成部分封装成对象
2、组成：
* Window：窗口对象
1、创建
2、方法
3、属性
4、特点
* Window对象不需要创建可以直接使用 window使用，window.方法名();
* window引用可以省略。 方法名()
* Navigator：浏览器对象
* Screen：显示器屏幕对象
* History：历史记录对象
* Location：地址栏对象
3、Window对象
1、创建
2、方法
1、与弹出框有关的方法
alert(): 显示带一段信息和一个确认按钮的警告框
confirm() 显示带有一段信息以及确认按钮和取消按钮的对话框
* 如果用户点击确定按钮，则方法返回true
* 如果用户点击取消按钮，则方法返回false
prompt() 显示可提示用户输入的对话框
*返回值：获取用户输入的值
2、与打开关闭有关的方法：
close()：关闭浏览器窗口
* 谁调用close，就关谁
open()：打开一个新的浏览器窗口
* 返回一个新的window对象
3、与定时器有关的方式
setTimeout() 在指定的毫秒数后调用函数或计算表达式
* 参数：
1、js代码或者方法对象
2、毫秒值
* 返回值：唯一标识，用于取消定时器
clearTimeout() 取消有setTimeout() 方法设置的 timeout
setInterval() 按照指定的周期（以毫秒计）来调用函数或计算表达式
clearInterval() 取消由 setInterval() 设置的 timeout
3、属性
1、获取其他BOM对象：
history
localtion
Navigator
Screen
2、获取DOM对象
document
4、特点
* Window对象不需要创建可以直接使用 window使用，window.方法名();
* window引用可以省略。 方法名()
//1、alert
alert("666")
window.alert("555")
//2、confirm
var flag = confirm("确定推出吗？？")
alert(flag)
if(flag){
//退出
alert('欢迎下次再次登录')
}else{
//提示
alert('手别抖')
}
//输入框
//3、prompt
var result = prompt('请输入用户名');
alert(result)
//open
//打开一个新窗口
var openBtn = document.getElementById("openBtn");
var newWindow;
openBtn.onclick = function(){
newWindow = open("http://www.baidu.com");
}
//关闭一个新窗口
//close
var closeBtn = document.getElementById("closeBtn");
closeBtn.onclick = function(){
newWindow.close();
}
// 一次性定时器
setTimeout("fun()",3000);
var id = setTimeout(fun,3000);
// 取消定时器
clearTimeout(id);
function fun(){
alert('bbb~')
}
// 循环定时器
var id = setInterval(fun,2000)
// 取消循环定时器
clearInterval(id)
// 获取history
var h1 = window.history;
var h2 = history;
alert(h1)
alert(h2)
var openBtn = window.document.getElementById("openBtn");
alert(openBtn);
// document.getElementById("")
4、Location：地址栏对象
1、创建(获取)：
1、window.location
2、location
2、方法：
* reload() 重新加载当前文档，刷新
3、属性：
* href 设置或返回完整的URL
<input type="button" id="btn" value="刷新">
<input type="button" id="goflypig" value="flypig">
<script>
// reload方法，定义一个按钮，点击按钮，刷新当前页面
//1.获取按钮
var btn = document.getElementById("btn");
//2.绑定单击事件
btn.onclick = function(){
//3.刷新页面
location.reload();
}
// 获取href
var href = location.href;
alert(href)
//1.获取按钮
var goflypig = document.getElementById("goflypig");
//2.绑定单击事件
goflypig.onclick = function(){
//3.访问flypig
location.href = "https://www.flypig666.cn";
}
</script>
5、History：历史记录对象
1、创建（获取）：
1、windows.history
2、history
2、方法：
* back() 加载history 列表中的前一个 URL
* forward() 加载history 列表中的下一个 URL
* go(参数) 加载history 列表中的某个具体页面
* 参数
* 正数：前进几个历史记录
* 负数：后退几个历史记录
3、属性：
* length 返回当前窗口历史列表中的 URL 数量
<input type="button" id="btn" value="获取历史记录个数">
<a href="History_1.html">history1</a>
<input type="button" id="forward" value="前进">
<script>
//一、
//1、获取按钮
var btn = document.getElementById("btn")
//2、绑定单击事件
btn.onclick = function(){
//3、获取当前窗口历史记录个数
var length = history.length;
alert(length)
}
//二、
//1、获取按钮
var forward = document.getElementById("forward")
//2、绑定单击事件
forward.onclick = function(){
// history.forward();
history.go(+1)
}
</script>