一、BOM
1. 概述
代码语言:javascript
复制* BOM:Browser Object Model 浏览器对象模型
2. 组成
代码语言:javascript
复制① Window:窗口对象
② Navigator:浏览器对象
③ Screen:显示器屏幕对象
④ History:历史记录对象
⑤ Location:地址栏对象
二、Window
1. 方法
代码语言:javascript
复制alert():弹出警告框
prompt():弹出可输入对话框
confirm():弹出确认框
colse():关闭当前窗口
open(URL):打开新窗口
setTimeout("javaScript;",time):一次性倒计时
clearTimeout(id):取消 id 所代表的一次性倒计时
setInterval("javaScript;",time):循环倒计时
clearInterval(id):取消 id 所代表的循环性倒计时
2. 属性
代码语言:javascript
复制① 获取其他对象
* Navigator:浏览器对象
* Screen:显示器屏幕对象
* History:历史记录对象
* Location:地址栏对象
② 获取 DOM 对象
* document
3. 特点
代码语言:javascript
复制* Window对象不需要创建可以直接使用
* Window的方法可以直接使用
三、Location
1. 方法
代码语言:javascript
复制① reload():刷新网页
2. 属性
代码语言:javascript
复制* href:获取/设置地址
* var a = kk //获取链接
* kk = "https://www.baidu.com" //设置外部链接需要加协议
3. 示例
代码语言:javascript
复制//5秒后跳转至百度
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#div {
width: 300px;
height: 100px;
border: 2px silver solid;
margin: auto;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
text-align: center;
}
#message {
margin-top: 15px;
font-size: 20px;
color: deepskyblue;
}
a:link{
color: red;
text-decoration: none;
}
</style>
</head>
<body>
<div id="div">
<div id="message">注册成功</div>
<br />
<span id="span">5</span>秒后跳转至百度,点击<a href="javascript:void(0)" id="a">这里</a>直接跳转
</div>
<script>
//获取元素
var span = document.getElementById("span");
var a = document.getElementById("a");
//设置初始值
var time = 5;
function f1() {
time--;
//倒计时结束跳转
if (time <= 0) {
kk = "https://www.baidu.com";
}
//修改显示的倒计时
span.innerHTML = time "";
}
//单击事件
a.onclick = function () {
kk = "https://www.baidu.com";
};
//循环执行
setInterval(f1,1000);
</script>
</body>
</html>
四、History
1. 方法
代码语言:javascript
复制① back():加载历史记录中的前一个网页
② forward():加载历史记录中的后一个网页
③ go(param):加载历史记录中的一个网页
param:
n ---> 前进n页
-n ---> 后退n页
2. 属性
代码语言:javascript
复制* length:history中的记录个数
3. 注意
代码语言:javascript
复制* 是当前页面的历史记录不是浏览器的历史记录